MasterClass Angular Avançado e E-Book GRATUITO

Construa sua própria biblioteca, aprenda recursos avançados do Angular

Classificação: 4.3 de 51174 avaliações 7 horas totais 77 palestras Intermediário Construa sua própria biblioteca, aprenda recursos avançados do Angular Você gostaria de construir sua própria biblioteca de código aberto? Provavelmente todos nós desenvolvedores já pensamos em algum momento em construir nossa própria biblioteca e contribuir para a comunidade de código aberto em geral. O objetivo deste curso é fornecer todas as ferramentas necessárias para que você possa criar sua própria biblioteca Angular de código aberto. Vamos construir uma série de pequenas bibliotecas de código aberto de dificuldade progressivamente crescente e aprender uma grande quantidade de recursos avançados do Angular de uma maneira divertida e prática.

Qual é a melhor maneira de aprender recursos avançados do Angular?

A melhor maneira de aprender o Angular e seus recursos mais avançados é simplesmente usá-lo para construir algo concreto, como por exemplo, uma aplicação ou uma biblioteca - e fazer isso passo a passo, pois não há substituto para essa experiência. Para entender uma tecnologia, realmente precisamos construir algo não trivial com ela - posts de blog e documentações só nos levam até certo ponto. Isso, é claro, consome muito tempo para fazer sem ajuda, pois teremos que aprender tudo por conta própria ao longo do caminho, juntando um número infinito de posts de blog, documentações e respostas do Stackoverflow. Portanto, para realmente mergulhar fundo no Angular, vamos usá-lo para construir uma série de pequenas bibliotecas reutilizáveis. O objetivo é criar um cenário de prática e aprender os recursos avançados do Angular em seus casos de uso originais, onde eles fazem mais sentido e, portanto, são mais fáceis de aprender.

Quais bibliotecas construiremos neste curso?

Vamos construir as seguintes bibliotecas e aprender como publicá-las no NPM usando o Formato de Pacote Angular: Começaremos fazendo uma Caixa de Entrada personalizável do Font Awesome e aprenderemos as vantagens de projetar nossos componentes usando projeção de conteúdo em vez de um design mais baseado em entrada/saída. Nesta etapa, também introduziremos o ecossistema de testes do Angular. Em seguida, aumentaremos progressivamente a dificuldade de cada biblioteca: construiremos um contêiner de guias dinâmico que permite receber um modelo como entrada de componente, permitindo efetivamente substituir partes do modelo do componente enquanto mantemos uma aparência e sensação padrão para o componente. Em seguida, construiremos um componente de modal dinâmico reutilizável com conteúdo personalizável. Este componente terá seu conteúdo configurável por meio de projeção de conteúdo ou um modelo de entrada, e introduzirá a noção de Diretivas Estruturais. Também aprenderemos como as diretivas e componentes de um determinado módulo podem interagir de forma transparente, independentemente do local em que são usados no modelo, usando um serviço de biblioteca compartilhada. Em seguida, construiremos uma diretiva de máscara de entrada, onde abordaremos alguns comportamentos avançados de manipulação de teclado. No final do curso, vamos pegar todos os componentes e diretivas que construímos nas seções anteriores e vamos construir um exemplo maior usando-os: um Widget de Modal de Pagamento! Em seguida, introduziremos o módulo de Animações do Angular e o usaremos para animar o widget de modal, veremos como definir animações que podem ser reutilizadas em componentes.

O que você aprenderá neste curso?

Aprenderemos como criar uma biblioteca compatível com AOT no Formato de Pacote Angular, como definir um módulo de biblioteca, como isolar os estilos de um componente, mas ainda torná-los personalizáveis, como projetar componentes e diretivas para torná-los mais fáceis de manter - tornando-os personalizáveis, ao mesmo tempo em que oferecem um ótimo comportamento padrão para os componentes. Abordaremos todos os recursos mais avançados do Angular, incluindo Design de API de Componente, melhores práticas de Estilização de Componente, Templates e Saídas de Template, ng-content, ng-container, isolamento e personalização de estilo, AOT, eventos globais, depuração com o CLI, @ViewChildren, @ContentChildren, Light DOM vs Shadow DOM, @HostBinding, @HostListener, componentes dinâmicos, diretivas, manipulação de eventos de teclado, testes, animações e muito mais (esta é uma lista não extensiva). Mas mais do que apresentar os recursos isoladamente, vamos usá-los em casos de uso reais, o que tornará os recursos muito mais fáceis de aprender.

O que você será capaz de fazer ao final deste curso?

Ao final deste curso, você conhecerá muitos dos recursos mais avançados do Angular, mas, acima de tudo, saberá quando usá-los e por quê. Você saberá como construir bibliotecas Angular de código aberto e como disponibilizá-las para a comunidade de código aberto no NPM. Com este curso avançado, você terá uma base sólida no Angular: muito provavelmente você será capaz de lidar com as tarefas de desenvolvimento Angular mais avançadas que encontrar em seu trabalho diário ou projetos pessoais. Dê uma olhada nas lições gratuitas do curso abaixo e aproveite o curso!

O que você aprenderá

- Código no repositório do Github com arquivos ZIP para download por seção - Aprenda os recursos mais avançados do Angular - Aprenda como construir bibliotecas Angular de código aberto - Design de API de Componente - Melhores práticas de Estilização de Componente - Templates e Saídas de Template, ng-content, ng-container, isolamento e personalização de estilo - AOT, eventos globais, depuração com o CLI, @ViewChildren, @ContentChildren - Light DOM vs Shadow DOM, @HostBinding, @HostListener, componentes dinâmicos - Diretivas, manipulação de eventos de teclado, testes, animações e muito mais