Curso Angular 13: Criando componentes - #04

e a galera beleza seja bem-vindos a mais umas curte Ângela eu sou Matheus Batista tu tá na hora de acordar e hoje a gente vai falar sobre criação de conhece mas disso não esquece deixar aquele like se inscreve no canal ajuda demais compartilha aqui também esse cuscuz quer aprender angular dieta o final da Fazer o projeto Fit Tech muito massa inscrição encontra os links aí repositório de recurso os nossos cursos na udemy também as redes sociais Beleza depois da hora dia que vale a pena incrível como é que vai ser daqui deu um cupom interessa

aula e ver aí os efeitos através do comando direção e componente o ângulo e também a inserção dos componentes na nossa aplicação vai então esse objetivo dessa aula aqui eu boto para tirar um componente a gente pode utilizar o celular e isso não é obrigatório galera mais Acontece muita coisa por baixo dos panos a gente faz isso tá então é super interessante que a gente utilize os comandos disponíveis do Angola poder fazer as coisas que tem que fazer Nossa aplicação e nesse curso é um passar todos mais o paciente deve tá comando de criação NG

generate tá e o nome do componente aqui sente colocar só o nome e vai criar o componente de avulso vai jogar no projeto isso é ruim tá Eu geralmente separa os componentes os chefes outras entidades em outras pastas tá hoje componente para tudo ficar mais organizado eu vou mostrar pra vocês como fazer isso botou os arquivos necessários são criados do projeto então enche a viu isso na aula passada Quais são os arquivos necessários HTML5 template o typescript É a lógica do componente o arquivo de teste lá para gente fazer os testes depois e também de

CSS para estilizar esse componente incitam tudo isso é criado a partir desse Command aqui da vai cortar o componente batizar o seletor em um HTML outro componente Então a gente vai entender também a autonomia do componente sala que é esse selector aqui velho eu falei ser tomar selector o nome correto aí o termo to Angola usa eu vejo então vivo secretória Bora preditor de cólica ossos compõem bom então galera estamos aqui no editor de código igual parado na aula passada tá eu vou fechar tudo aqui é o mais simples yak-40 rolando ângulo em precisa botei

lá para rodar os comandos certo então eu vou abrir uma nova aqui ó para não ter que parar no servidor pelo que tá no mai Sim ele me dá um novo terminal aqui beleza então como é que ele vai querer mas como componente eu tenho que me ou epp tem um componente também tudo acompanha aqui não é não tá eu preciso criar outro porque eu vou seccionar o meu projeto mano eu tenho que fazer isso para que a gente consiga é reaproveitar esse componente que é uma das sua sofias né da arquitetura mais utilizadas nesse

frango estava escrito até a reutilização de componentes é muito forte na quando utiliza esse cara tá viu o iett Angola seja só que eu vou te dar um LG generator tá eu tenho bolsa aqui componente que eu posso tirar várias coisas eu acho que não tava slime mas eu posso tirar várias coisas não é então uma dessas entidades é o componente então ele bota componente e depois a gente coloca o nome do componente mas E aí vou botar aqui ó componentes É sim porque aí ele vai criar ou parcelada componentes e vai se todos os

componentes nosso projeto lá e isso Vai facilitar por obrigação Futura do projeto tá essa tudo que a gente vai utilizar ao longo dessas aulas também projeto prático e que coloca o nome do componente pode ser se ao forçar eu boto traço componente ele vai criar o projeto aqui né ele vai criar esse componente com esse nome aqui no meu projeto eu vou dar um jeito aqui e aí galera ele vai fazer os cliente aqui eu recebi um feedback no meu terminal então tem que ver o que aconteceu isso é extremamente importante não só preocupante não

só sair programando mais viu que aconteceu aqui micro quatro coisas realizou uma coisa então Ele criou os 4 arquivos que a gente já tava sabendo que ele é criar HTML o arquivo de teste aqui tá escrito CSS beleza tudo aqui ó depois componentes de uma nova pasta e não ia jogar aqui para ele jogar essa parte aqui e é ficar 500 companhias que é serviço não é legal para esquecer que sou mais você quer dizer que ter a paciência resumida aqui como é que é o outro componente ele vai aparecer embaixo dela então vai ficar

melhor mas basicamente então parte da outra ou então os arquivos estão dentro dela tá beleza também tem que ver aqui também aconteceu ao por baixo dos panos teve um update uma atualização aqui vai. Móvel protesta esse aqui é o arquivo central de configuração da nossa aplicação o geralmente o turismo bosta aqui não ela esses componentes dele dentro do próprio ângulo a gente vai importar outros componentes quantos que a gente ia tem que ficar aqui aí eles ficam mapeados na aplicação tá então de criou se for se comporta aqui ele gerou automaticamente a implantação pra gente

e colocou aqui nas declaration então agora a nossa aplicação está ciente aquele componente existe beleza isso é muito importante para a gente aí tá entendendo porque a gente cria não tivesse colocar essa Import aqui senão não funciona tá Por Isso Eu Corro importância no LG no todo neocoins sei lá e do ela né ao tentar utilizar Este comando para fazer as coisas pois Vai facilitar bastante evitar dor de cabeça tô aqui no nosso forte componente pode alterar o parafuso template que veio né fica o código base é o csm gerado por corrente uma simples parágrafo

tá funcionando componente aqui o arquivo de tags dessa maneira negócio aqui de voz que é bem assim tá eu posso colocar aqui H2 meu primeiro componente Tá e agora preciso importar esse cara lá no ERP tem umas roupinhas Central quem dá vida a aplicação toda e também os demais componentes Beleza então aqui se a gente ver e tem basicamente tags HTML sem importar os componentes aqui ele tem que fazer se colocar o celular que tu ficou com ele como foi para vocês tá então sei lá como é que a gente sabe saliva pode aqui no

Aqui tá escrito em vai vir aqui a roupa com ponte e se a roupa com ponte eu decorei agora é uma meta configuração do componente é um de colheita de classe lado typescript não precisa de muita discutir para é saber o que tá acontecendo aqui em configurações que ele vai realizar o nosso com pães Mas se tiver interesse em curso é inscrito do canal e também a Neuza que tá é importante é que não quer torná-la profissionalmente ela tá eu aconselho Tô aqui de costura três coisas Será que a gente precisa Então esse cara aqui

para mostrar bem clipe Wellington é o caminho para o tempo desse componente veja que tu customizado mas ele automaticamente liga para esse nosso HTML que entrou aqui também ele configurar a styleurl eu poderia colocar mais uma vez vem que vem no Array aqui né O que é o arquivo de CSS this component Cross Coupe nunca dissesse aqui mas sempre tive apenas no meu componente tá é que sabe qual o seu like é esse cara aqui agora aqui um formato de tag tem que vir aonde querem Portal componente presente aqui em ef.com podem as contas e

chinelo né ele aqui a gente vai colocar tag com o nome do seu ex e ap então sempre essencial up for se componentes beleza é o e fecha até isso vai gerar a importação daquele completo A gente criou anteriormente aqui nossa aplicação tô sente salva devagar navegador eu vejo aqui a importação do meu primeiro componente quiser conseguiu criar importar um componente no aguarde e esse é um passo muito importante que ele vai fazer isso ao longo da nossa aplicação toda né outro curso aqui mostrar diversos componentes beleza mais uma coisa muito importante aqui é sim

taxista é simples prefixo.de traz alguma coisa e esse alguma coisa é o nome do componente celular que um componente a gente pode ter acesso aqui ao força componente o PS em que criou automaticamente com Wind generator Beleza então é isso eu quero que vocês entendam a gente veio aqui no CSS nele que está precisa pagar dois color red eu vou deixar a cor desse H2 aqui ó vermelha pois só se eu nem vocês é se acompanhe aqui você vai está automaticamente tudo em casa muito interessante essa parte para gente também vai ter uma aula sobre

específica sob Ah mas eu queria mostrar para vocês tem que vir aqui ó potência H2 utilizado tá esse eu crio um outra dois aqui não é por exemplo H2 testando H2 ele não vai ganhar aquela cortar não vaza o CSS fica escopo de fica no componente aí se eu consigo muito importante também dissesse do ano que tu tem que entender tá bom então galera espero ter gostado dessa aula foi mal a interessante para fundamentos da criação de componentes e sem vai fazer ao longo de diversas salas para entender melhor sua estrutura e trabalhar com composto

anos tá o espaço essenciais entre o novo componente as seguinte esses moldes faça alterações necessárias em porte ele para ver que tu realmente consegue né chegou mais como desafio porque realmente muito importante é um processo está realizando o dia a dia um o ângulo DS Beleza eu vou ficando por aqui eu vou deixar o like se inscreva no canal e se me ajudar muito compartilhe com os amigos se vídeos eles vão aprender com certeza também não guarde esta e não esquece aqui na descrição e os links importantes os custos acordar o repositório do curso e

também as nossas redes sociais por hoje é isso vou ficando por aqui espero vocês na próxima aula valeu