Apresentação do curso
Bem vindos ao curso
Porque usar o Angular
Links úteis e essenciais do Angular
Instalação e Configuração do Ambiente de Desenvolvimento
Introdução à seção
Instalação do Node.js
Instalação e configuração do NVM (Node Version Manager)
Instalação do Visual Studio Code
Instalação e configuração do GIT
Introdução ao Typescript
Introdução à seção
Desenvolvimento da primeira função com o Typescript
Arquivo de configuração tsconfig.json
Tipos de dados básicos: o tipo ANY
Tipos de dados básicos: o tipo STRING
Tipos de dados básicos: o tipo BOOLEAN
Tipos de dados básicos: o tipo NUMBER
Tipos de dados básicos: o tipo ARRAY
Enums: como desenvolver e utilizar com o Typescript
Enums: como mudar os valores padrões
Funções: primeira função com o Typescript
Funções: declaração de parâmetros de entradas tipados
Funções: declaração de parâmetros de entrada com valores default
Funções: funções com parâmetros REST
Funções: Arrow Functions
Classes: introdução à criação de classes com o Typescript
Classes: Construtores
Classes: métodos internos da classe
Classes: como fazer o uso de Herança
Classes: modificadores de acesso
Interfaces: introdução e criação de Interfaces tipadas
Interfaces: Criação de interfaces funcionais e implementação com classes
Generics: introdução e uso com o Typescript
Generics: desenvolvimento de funções genéricas
Módulos: Introdução, desenvolvimento e uso nos nossos projetos
Primeiro projeto com o Angular
Apresentação da seção
Primeiro projeto com o Angular
Detalhamento da estrutura do projeto Angular
Módulos no Angular: o que são e a sua importância em um projeto
Components e Templates no Angular: o que são e como se relacionam
Instalação e Desenvolvimento de primeiro projeto com o Angular CLI
Introdução à seção
Instalação do Angular CLI
Primeiro projeto com o Angular CLI
Estrutura de projeto gerado através do Angular CLI
Arquivos de ambientes específicos: Desenvolvimento, Homologação e Produção
Introdução e demonstração do comandos mais importantes do Angular CLI
Ng doc: Como usar o Angular CLI para pesquisa na documentação do Angular
Como atualizar o Angular CLI
Projeto Gestão de vinhos: apresentação e configuração inicial do projeto
Introdução às seções de desenvolvimento do projeto Gestão de Vinhos
Arquitetura - Projeto Gestão de Vinhos
Geração do projeto com o Angular CLI
Inclusão do Bootstrap 4 como template do projeto
Projeto Gestão de Vinhos: Listagem de Vinhos
Criação da classe de modelo: vinho.ts
Geração do primeiro componente do projeto: Listagem de vinhos
Separação de responsabilidades: classe de serviço para gerenciar vinhos
Services: o que são e porque utilizá-lo na separação de responsabilidades
Criação e configuração de API simulada para requisições de dados de negócio
Implementação de requisição assíncrona à API com Promises
Requisições assíncronas com Http e Promise
Aula extra: Implementação de requisição assíncrona à API com Observable
Projeto Gestão de Vinhos: Cadastro de novo vinho
Geração de componente para o cadastro de Vinhos
Introdução ao Router Module: configuração de rotas de acesso a componentes
Configuração de barra de menu para Navegação no Cadastro e Listagem de vinhos
Implementação de botão para voltar do Cadastro para Listagem de Vinhos
Cadastro de vinhos: fluxo completo do formulário ao envio dos dados ao Servidor
Two-way databinding: uma abordagem mais detalhada
Validação dos campos do formulário de cadastro de vinhos
Validação de campos com ngModel: uma abordagem mais detalhada
Componente para detalhamento de todos os atributos do Vinho
Criação de componente e template para exibir os detalhes de um vinho
Detalhamento de vinho: da busca no Servidor até à exibição para o usuário
Implementação do botão para voltar para a tela de listagem de vinhos
Seleção de vinho na tela de listagem e redirecionamento para a tela de detalhes
Edição de vinhos
Carregamento de vinho cadastrado para edição e criação de rota
Seleção de vinho na tela de listagem e redirecionamento para tela de edição
Edição de vinhos: envio de dados atualizados para o Backend
Remoção de vinho
Remoção de vinho: implementação do fluxo completo
Componente para notificações
Introdução à seção para criação de componente de Notificações
Modelo para criação de objetos para Notificação
Serviço para criar uma notificação: Subject e Observable
Fluxo de exibição do componente de notificação
Tipos de alertas customizados: controle com NgClass
Melhorias no serviço de Notificação: criação de alertas específicos
Animações: Transições entre estados para controle da exibição do alerta
Animações com o Angular: introdução e principais conceitos
Pipes: padrões do Angular e Pipe customizada para busca de vinhos
Pipes padrão do Angular: formatação de datas
Pipes padrão do Angular: transformação de frases maiúsculas
Busca dinâmica na listagem de vinhos: criação de Pipe para filtragem de vinhos
Pipes: introdução, principais conceitos tipos de pipes
Diretivas no Angular
Diretivas de atributo: como criar e aplicar na barra de navegação do projeto
Diretivas de atributo dinâmicas ao associar eventos com @HostListener
Introdução às Diretivas no Angular: o que são e como usar
Interação entre componentes
Criação de componente de estrutura de página
Uso do componente de estruturas de página na tela de detalhamento de vinhos
Ng-content: detalhamento e múltiplas declarações no componente de páginas
Implementação de botão para voltar padrão e emissão de eventos com EventEmitter
Interação entre componentes: introdução e maiores detalhes
Criação de componente para encapsular a exibição das propriedades de um vinho
Reuso do componente de atributos de um vinho na tela de listagem
Autenticação e proteção de rotas com AuthGuard
Introdução à seção
Criação de nova API simulada para implementação de método para simular o login
Detalhamento da nova API simulada e o porque foi criada
Criação da classe de modelo para login: Usuario.ts
Criação de componente de para login no sistema
Proteção da barra de navegação do sistema antes da autenticação
Autenticação do usuário através do backend
Implementação da proteção de rotas do sistema com AuthGuard
Implementação do fluxo de logout do sistema
Exibição do nome do usuário autenticado na API na barra de navegação do sistema
Restringir acesso à operações com vinhos na API simulada através de token
Introdução e detalhamento de Route Guard
Deploy do projeto
Introdução à sessão
Geração dos arquivos de build com ng build e deploy local com http-server
Detalhamento dos arquivos gerados através do comando ng build
Deploy do projeto do Heroku