Angular 2 e 4: Desenvolva agora de forma simples!

Aprenda e comece a desenvolver agora projetos com a nova versão do Angular!

4.70 (80 reviews)
Udemy
platform
Português
language
Web Development
category
instructor
313
students
9.5 hours
content
Jul 2017
last update
$19.99
regular price

What you will learn

Criar projetos com a nova versão do Angular

Aplicar os conceitos e exemplos do curso nos seus projetos

Adquirir conhecimentos em uma nova linguagem de programação (Typescript)

Aprender e ganhar experiência no desenvolvimento de projetos com a nova versão do Angular

Compreender a importância em manter todo o projeto Angular do lado do cliente (browser)

Description

Quer aprender como desenvolver projetos com o Angular de forma eficiente, passando por todos os seus conceitos, através de um projeto prático?

Neste curso, vamos apresentar o Angular, entender as suas principais características e o porque atualmente ele é bem procurado pela comunidade. 

Durante o fluxo do curso, vamos introduzir o Angular, mostrar as suas principais vantagens e características em adotá-lo nos seus projetos. Vamos também ensinar como usar o Typescript, um superset do Javascript, utilizado como linguagem de programação base no desenvolvimento de projetos do Angular.

Ensinaremos a usar o Angular com uma abordagem 100% prática. E em paralelo, vamos introduzir os seus principais conceitos.

Para finalizar o curso, vamos mostrar como gerar os arquivos necessários para executar o projeto Angular em produção.

E para complementar o seu aprendizado, vamos disponibilizar alguns capítulos de bônus, para aumentar e otimizar o aprendizado e desenvolvimento de projetos com o Angular.

Serão fornecidos todos os slides, recursos da internet e principalmente, os códigos-fonte hospedados no github de todos os exemplos desenvolvidos em todas as seções do curso. Com estes materiais à sua disposição, tenho certeza que o seu aprendizado será muito eficiente.

Fiquem à vontade para assistirem às aulas abertas do curso, e inclusive experimentá-lo por 30 dias. Alguns vídeos estão disponíveis gratuitamente para ajudá-lo a se inscrever e aprender conosco. 

Estou à disposição para ajudá-lo nesta jornada incrível com o Angular. O objetivo é o aprendizado e domínio do Angular ao final do curso.

Clique agora para comprar o curso e evolua cada vez mais a sua carreira com o Angular!

Tenho certeza que vão adorar o conteúdo e a didática do curso!

Content

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

Screenshots

Angular 2 e 4: Desenvolva agora de forma simples! - Screenshot_01Angular 2 e 4: Desenvolva agora de forma simples! - Screenshot_02Angular 2 e 4: Desenvolva agora de forma simples! - Screenshot_03Angular 2 e 4: Desenvolva agora de forma simples! - Screenshot_04

Reviews

Armando
August 13, 2019
O curso busca evoluir uma aplicação aplicando o maior número de conceitos possíveis existente no Angular, o que torna o curso excelente para quem esta começando.
Gisele
January 3, 2018
Inicialmente as aulas são bem explicadas e são bem abrangentes quanto ao assunto inicial de Typescript. Consegui aprender bastante. Mais pro final do curso as coisas já ficaram muito rápidas, já não explicava mais como fazer os métodos e era necessário ficar dando um copy/paste do git. No geral, é um curso bom, e dá pra ter uma boa noção sobre o Angular e Typescript.
Arlei
September 28, 2017
Melhor curso de Angular que fiz até hoje. Sequência perfeita para a pessoa aprender. Muito bom mesmo! Parabéns, que venham mais cursos por aí.
Diego
September 24, 2017
Ótimo planejamento das aulas e total controle e confiança da informação que está sendo passada. SUPER INDICO. Só fez falta, em algumas aulas, do 'Por quê' de algumas. Faça assim ou faça isso, mas o motivo não ficou muito claro. Nada que o aluno não consiga com uma pequena 'googlada' ou mesmo pergunte no próprio canal do curso. Enfim, só uma sugestão para que o curso fique 100%.
Felipe
September 1, 2017
Curso muito bom, aprendi bastante, o professor está de parabéns só faltou dar um pouco mais de explicação em algumas coisas, parâmetros e outras funcionalidades que ficaram um pouco obscuras.
Cleomar
June 26, 2017
Didática do curso está muito boa, iniciando nesse momento a parte mais importante e esperada do curso que é Criação de projeto, pela introdução será muito interessante.
Douglas
June 15, 2017
Professor com ótima didática. Explica bem sem ser de forma massante e atende às dúvidas postadas. Recomendo muito!
Ricardo
May 22, 2017
Estou gostando bastante da instrução, só que como estou acompanhando junto com a explicação, ou seja, digitando o exercício junto, o zoom poderia estar um pouco maior a fonte de onde o instrutor está digitando, porque não dá para ler ao dividir as telas para acompanhar. Fora isso, estou iniciando no Angularjs e estou gostando da didática.

Charts

Price

Angular 2 e 4: Desenvolva agora de forma simples! - Price chart

Rating

Angular 2 e 4: Desenvolva agora de forma simples! - Ratings chart

Enrollment distribution

Angular 2 e 4: Desenvolva agora de forma simples! - Distribution chart

Related Topics

1106312
udemy ID
2/8/2017
course created date
5/13/2020
course indexed date
Bot
course submited by