Curso de Angular 17

Introdução ao Angular 17

• O que é Angular?/li>
• Angular vs React vs Vue
• Visão geral das funcionalidades e arquitetura do Angular 17
• Configurando o Ambiente de Desenvolvimento

Primeiros Passos

• Criando um novo projeto Angular 17 usando o Angular CLI
• Explorando a estrutura e os arquivos do projeto
• Executando e servindo a aplicação
• Exibindo dados usando interpolação e expressões

Componentes

• Compreendendo o papel dos componentes no Angular 17
• Criando e usando componentes
• Passando dados entre componentes usando inputs e outputs
• Usando hooks de ciclo de vida dos componentes

Diretivas

• Compreendendo a diferença entre diretivas estruturais e diretivas de atributo
• Criando e usando diretivas incorporadas, como ngIf, ngFor, ngSwitch, etc.
• Criando e usando diretivas personalizadas

Pipes

• Compreendendo a finalidade dos pipes no Angular 17
• Criando e usando pipes incorporados, como date, currency, json, etc.
• Criando e usando pipes personalizados

Serviços

• Compreendendo o papel dos serviços no Angular 17
• Criando e usando serviços
• Injetando dependências usando providers

Módulos

• Compreendendo o papel dos módulos no Angular 17
• Criando e usando módulos
• Importando e exportando módulos

Data Binding

• Compreendendo a diferença entre data binding unidirecional e bidirecional
• Criando e usando property binding, event binding e a sintaxe banana-in-a-box
• Usando variáveis de referência de modelo (template reference variables)

Roteamento

• Compreendendo o papel do roteamento no Angular 17
• Criando e configurando rotas
• Navegando entre rotas usando routerLink e router.navigate()
• Usando parâmetros de rota, parâmetros de consulta e fragmentos

Formulários

• Compreendendo a diferença entre formulários baseados em modelo e formulários reativos
• Criando e validando formulários usando controles de formulário, grupos de formulário, arrays de formulário, etc.
• Usando validadores incorporados, como required, minLength, maxLength, etc.
• Criando e usando validadores personalizados

Cliente HTTP

• Compreendendo o papel do cliente HTTP no Angular 17
• Criando e usando requisições HTTP para se comunicar com serviços de back-end
• Usando observables para gerenciar fluxos de dados assíncronos
• Usando interceptores para modificar ou gerenciar requisições ou respostas HTTP

Novo Fluxo de Controle Declarativo

• Explicando a nova sintaxe de blocos de controle de modelo e como ela simplifica tarefas comuns, como renderização condicional, iteração e tratamento de coleções vazias
• Forneça exemplos de uso dos novos blocos, como @if, @else, @switch, @case, @default, @for e @empty
• Comparando a nova sintaxe com a anterior, como *ngIf, *ngSwitch e *ngFor
• Destacando como os novos blocos de controle dão suporte a aplicações zoneless com sinais

Blocos de Carregamento Diferido

• Explicando o conceito de carregamento diferido e como ele pode melhorar o desempenho e a experiência do usuário em aplicações web
• Apresentando o novo bloco de controle @defer, que habilita o carregamento sob demanda do conteúdo do bloco e suas dependências
• Forneça exemplos de uso do bloco @defer para diferentes cenários, como carregamento de componentes, diretivas, pipes, animações e estilos
• Destacando como o bloco @defer funciona com a nova API de transições de visualização

API de Transições de Visualização

• Explicando a finalidade e os benefícios da API de transições de visualização, que permite aos desenvolvedores personalizar animações e transições entre visões
• Apresentando a nova diretiva withViewTransitions, que habilita o uso da API de transições de visualização
• Forneça exemplos de uso da diretiva withViewTransitions com diferentes tipos de transição, como fade, slide, zoom e flip
• Destacando como a API de transições de visualização funciona com o roteador Angular e o histórico do navegador

Outras Funcionalidades e Melhorias

• Resumo breve de algumas das outras funcionalidades e melhorias oferecidas pelo Angular 17, como:
• Suporte para passar @Component.styles como uma string
• O código de animações do Angular pode ser carregado sob demanda
• Suporte ao TypeScript 5.2
• A API de sinais principal agora está estável
• O suporte ao Node.js v16 foi removido e a versão mínima suportada é a v18.13.0
• Esbuild será o construtor padrão e o servidor de desenvolvimento padrão usará Vite