Programa do Curso
Introdução
- O que é o Angular?
- Angular vs React vs Vue
- Visão geral dos recursos e da arquitetura do Angular 17
- Configuração do ambiente de desenvolvimento.
Iniciando
- Criação de um novo projeto Angular 17 usando o Angular CLI.
- Exploração da estrutura e dos arquivos do projeto.
- Execução e publicação (serving) da aplicação.
- Exibição de dados usando interpolação e expressões.
Componentes
- Compreensão do papel dos componentes no Angular 17.
- Criação e uso de componentes.
- Passagem de dados entre componentes usando inputs e outputs.
- Uso de hooks do ciclo de vida dos componentes.
Diretivas
- Compreensão da diferença entre diretivas estruturais e de atributo.
- Criação e uso de diretivas integradas, como ngIf, ngFor, ngSwitch, etc.
- Criação e uso de diretivas personalizadas.
Pipes
- Compreensão do propósito dos pipes no Angular 17.
- Criação e uso de pipes integrados, como date, currency, json, etc.
- Criação e uso de pipes personalizados.
Serviços
- Compreensão do papel dos serviços no Angular 17.
- Criação e uso de serviços.
- Injeção de dependências usando providers.
Módulos
- Compreensão do papel dos módulos no Angular 17.
- Criação e uso de módulos.
- Importação e exportação de módulos.
Vinculação de Dados (Data Binding)
- Compreensão da diferença entre vinculação de dados unidirecional e bidirecional.
- Criação e uso de vinculação de propriedades, vinculação de eventos e sintaxe banana-em-uma-caixa (banana-in-a-box).
- Uso de variáveis de referência de template.
Roteamento
- Compreensão do papel do roteamento no Angular 17.
- Criação e configuração de rotas.
- Navegação entre rotas usando routerLink e router.navigate().
- Uso de parâmetros de rota, parâmetros de consulta (query parameters) e fragments.
Formulários
- Compreensão da diferença entre formulários orientados a template e reativos.
- Criação e validação de formulários usando controles de formulário (form controls), grupos de formulários (form groups), arrays de formulários (form arrays), etc.
- Uso de validadores integrados, como required, minLength, maxLength, etc.
- Criação e uso de validadores personalizados.
Cliente HTTP
- Compreensão do papel do cliente HTTP no Angular 17.
- Criação e uso de requisições HTTP para se comunicar com serviços back-end.
- Uso de observables para manipular fluxos de dados assíncronos.
- Uso de interceptors para modificar ou manipular requisições ou respostas HTTP.
Novo Fluxo de Controle Declarativo
- Explicação da nova sintaxe do bloco de controle de template e de como ela simplifica tarefas comuns, como renderização condicional, looping e manipulação de coleções vazias.
- Exemplos de uso das novas tags, como @if, @else, @switch, @case, @default, @for e @empty.
- Comparação da nova sintaxe com a anterior, como *ngIf, *ngSwitch e *ngFor.
- Mencionar como os novos blocos de controle suportam aplicações sem zone (zoneless) com sinais (signals).
Blocos de Carregamento Tardio (Deferred Loading Blocks)
- Explicação do conceito de carregamento tardio e de como ele pode melhorar o desempenho e a experiência do usuário das aplicações web.
- Introdução do novo bloco de controle @defer, que habilita o carregamento tardio do conteúdo do bloco e suas dependências.
- Exemplos de uso da tag @defer para diferentes cenários, como carregamento de componentes, diretivas, pipes, animações e estilos.
- Mencionar como a tag @defer funciona com a nova API de transições de visualização.
API de Transições de Visualização
- Explicação do propósito e dos benefícios da API de transições de visualização, que permite aos desenvolvedores personalizar as animações e transições entre visualizações.
- Introdução à nova diretiva withViewTransitions, que habilita o uso da API de transições de visualização.
- Exemplos de uso da diretiva withViewTransitions com diferentes tipos de transição, como fade, slide, zoom e flip.
- Mencionar como a API de transições de visualização funciona com o roteador do Angular e o histórico do navegador.
Outros Recursos e Melhorias
- Síntese breve de alguns dos outros recursos e melhorias que o Angular 17 oferece, como:
- Suporte para passagem de @Component.styles como uma string.
- O código de animações do Angular agora pode ser carregado tardiamente (lazy-loadable).
- Suporte ao TypeScript 5.2.
- A API central de sinais (signals) agora está estável.
- O suporte ao Node.js v16 foi removido, sendo a versão mínima de suporte o v18.13.0.
- Esbuild será o construtor padrão e o servidor de desenvolvimento padrão usará Vite.
Resumo e Próximos Passos
Requisitos
- Conhecimento de HTML, CSS e JavaScript.
- Experiência com TypeScript e RxJS.
- Experiência em desenvolvimento web.
Público-alvo
- Desenvolvedores que desejam aprender a usar o Angular 17 para criar aplicações web dinâmicas e responsivas.
- Desenvolvedores que desejam atualizar suas habilidades das versões anteriores do Angular.
- Programadores que desejam explorar os novos recursos e melhorias do Angular 17.
Testemunhos de Clientes (2)
Eu gostei bastante do fluxo do treinamento; ela passou pelo tópico e, no final do tópico, tinha sessões de prática bem definidas para nós. Ela foi capaz de nos guiar prontamente com os problemas que enfrentamos nas sessões de prática.
Rabin Byanjankar - Lument
Curso - Angular 17
Máquina Traduzida
Foi muito interativo e informativo. O instrutor foi muito paciente conosco quando não entendíamos algo e garantiu que ninguém ficasse para trás durante o treinamento.
Daniel - INIT Innovations in Transportation Ltd.
Curso - Angular 17
Máquina Traduzida