Gratuito

Criando Apps Web com Angular e UiKit

Que tal aprender criar belas Apps Web com Angular e UiKit?

• Sobre o curso
• Aulas

• Esta é a página do curso 7187 – Criando Apps Web com Angular e UiKit.

  Você já aprendeu o essencial do Angular no curso Começando com Angular? Ótimo.

  Agora, vamos evoluir nossos conhecimentos através da construção de um Frontend para uma API existente, que é um cenário muito comum na carreira de Devs Frontend.

  Neste curso vou te mostrar o UiKit e vamos construir um app para Petshop!

  Neste curso de Angular você vai...

  • Aprender a configurar um projeto Angular para utilizar Yarn e UiKit
  • Aprenda a utilizar o LESS para estilizar seu projeto Angular
  • Aprender a criar componentes em Angular usando o Angular CLI
  • Aprender a construir telas com formulários usando o UiKit
  • Aprender a construir rotas e trabalhar com Routing no Angular
  • Aprender a construir áreas públicas e áreas autenticadas na aplicação
  • Aprender e construir autenticação/login com Angular
  • Aprender a armazenar a utilizar o Token e Refresh Token do JWT com Angular
  • Aprender a renderizar componentes dinamicamente (pais e filhos)
  • Aprender a utilizar com Router Link
  • Aprender a utilizar uma API Backend mock com o Mockoon
  • Aprender e implementar o conceito de Services
  • Aprender a trabalhar com lista assíncrona (RxJS)
  • Aprender a chamar uma API externa com HttpClient
  • Aprender a enviar dados de um componente para outro
  • Aprender a implementar e usar Models e as vantagens da tipagem
  • Aprender a utilizar formatação com pipe no Angular
  • Construir uma tela de “loading” para indicar que a aplicação está ocupada
  • Aprender a criar máscaras para dados – por exemplo, para CPF – através de diretiva
  • Aprender a criar Custom Validators para validar o formulário
  • Aprender dicas práticas para lidar com os dados de login e sessão do usuário
  • Aprender a construir login e logout com Angular
  • Aprender a proteger rotas da aplicação com login
  • Aprender a executar a aplicação Angular em ambiente de desenvolvimento
  • Aprender sobre importações no Angular
  • Aprender a criar formulários básicos em Angular
  • Aprender a validar formulários no Angular
  • Aprender a habilitar/desabilitar botões em Angular
  • Aprender a persistir dados em Local Storage (browser)

  Para quem é recomendado este curso de Angular

  • Iniciantes na área de programação com JavaScript e TypeScript
  • Iniciantes que querem evoluir seus conhecimentos em Angular
  • Programadores com alguma experiência que querem adicionar Angular ao portfólio
  • Programadores interessados um curso para aprender a desenvolver um MVP com Angular
  • Profissionais em preparação para uma entrevista técnica com Angular

  Tecnologias e versões utilizadas

  • Node.js v11.5.0 (versão mínima)
  • Npm 6.4.1 (versão mínima)
  • Yarn 1.13.0 (versão mínima)
  • UiKit
  • Angular CLI 7.2.2
  • Mockoon 1.4.0
  • Visual Studio Code (Versão mais recente disponível)

  Projetos do curso

  • Criaremos um Frontend para uma Petshop, com vitrine de produtos, cadastro de produtos, carrinho de compras, área logada e área pública, construiremos componentes mais avançados, com dependências externas e implementaremos comunicação com uma API externa (mockada).
• • Módulo 1
    UiKit
    • Yarn - 2 mins
    • UiKit - 5 mins
    • Assets - 2 mins
    • Editando as Variáveis - 4 mins
    • Ícones Customizados - 5 mins
    • Compilando o Tema - 3 mins
    • Setup Inicial - 5 mins
    • Estilizando o Navbar - 11 mins
    • Tela de Login - 11 mins
    • Tela de Restauração de Senha - 2 mins
    • Tela de Cadastro - 3 mins
    • Tela de Pets - 5 mins
    • Tela de Produtos - 7 mins
    • Tela de Carrinho - 3 mins
  • Módulo 2
    Petshop App
    • Organizando o projeto - 7 mins
    • Master Pages - 9 mins
    • Configurando as Rotas - 5 mins
    • Active Link - 5 mins
    • Configurando o Backend - 5 mins
    • Services - 7 mins
    • Listas Assíncronas - 8 mins
    • Criando um Component - 4 mins
    • Passando dados para o Componente - 3 mins
    • Criando o Modelo de Produto - 2 mins
    • Utilizando o Model - 3 mins
    • Ajustando a Grid de Produtos - 3 mins
    • Pipe de Moedas - 3 mins
    • Alterando o Data Service - 4 mins
    • Tela de Login - 6 mins
    • Estilos Adicionais - 5 mins
    • Armazenando o Token - 9 mins
    • Refresh Token - 10 mins
    • Adicionando Loading - 5 mins
    • Mask Directive - 12 mins
    • Custom Validators - 6 mins
    • Security Util - 9 mins
    • Exibindo Usuário Logado - 3 mins
    • Logout - 2 mins
    • Auth Service - 7 mins
    • Route Guard - 2 mins
    • Toastr - 5 mins
    • Cadastro de Clientes: Parte 1 - 5 mins
    • Cadastro de Clientes: Parte 2 - 5 mins
    • Restauração de Senha - 4 mins
    • Enviando Token - 4 mins
    • Edição de Perfil: Parte 1 - 5 mins
    • Edição de Perfil: Parte 2 - 4 mins
    • Modelos do Carrinho - 2 mins
    • CarUtil - 6 mins
    • Adicionando Itens ao Carrinho - 3 mins
    • Manipulando o Carrinho - 3 mins
    • Visualizando o Carrinho - 4 mins
    • Exibindo Carrinho Vazio - 1 mins
    • Total do Pedido - 2 mins

Instrutor

---

Carreiras relacionadas

---

Artigos relacionados

• Blazor Render Modes
• Blazor - Rotas e Navegação
• Uma visão geral do Blazor

---

Cursos relacionados

---

Matricule-se