Série da semana: Buscas semânticas com Elasticsearch

Veja mais

curso Minha primeira Single Page Application com Angular

Neste curso você aprenderá a criar uma Single Page Application com o Angular, um dos frameworks JavaScript para criação de aplicações client-side mais utilizados. Para isso, usaremos como cenário um Dashboard, que apresenta um resumo das consultas marcadas, assim como do faturamento de uma clínica médica. Esta aplicação cliente receberá os dados com os quais trabalhará de uma Web API em produção, publicada na internet, e os apresentará em painéis criados para este fim. Ao longo deste curso você ... Ver mais aprenderá como trabalhar com o a Angular CLI para iniciar um projeto, criar componentes que manipulam o DOM e conversam entre si através de eventos, bem como a se comunicar com web services por meio de serviços. Com isso você também conhecerá o funcionamento da navegação por meio de rotas no Angular, um dos recursos fundamentais deste framework, muito utilizado neste tipo de aplicação.

Assine e tenha acesso completo Carga Horária No Certificado - 25H

Conteúdo do Curso de Angular

Aula 1 - free

Introdução

Apresentamos nesta aula a aplicação em execução que construímos ao longo do curso. Trata-se de um Dashboard que apresenta um resumo das consultas marcadas, bem como do faturamento de uma clínica médica, em painéis.
free
Aula 2 - mvp

Criando o projeto

Um projeto Angular possui diversos arquivos, em grande parte destinados a criação da infraestrutura necessária para que a aplicação funcione. Para que não seja necessário criá-los manualmente utilizamos uma ferramenta chamada Angular CLI.
mvp
Aula 3 - mvp

Executando o projeto

Agora que criamos o projeto podemos executá-lo para vê-lo em funcionamento no navegador. Com isso seremos apresentados a um componente e ao seu papel dentro de uma aplicação Angular, bem como ao mecanismo que permite exibir conteúdo HTML.
mvp
Aula 4 - mvp

Criando um componente Olá Mundo

Antes de criarmos componentes mais complicados, iniciaremos com um que contém apenas um parágrafo com uma cor de texto personalizada, conhecendo assim a sua estrutura. Veja como criá-lo nesta aula.
mvp
Aula 5 - mvp

Ng serve

Na última aula vimos que a aplicação foi iniciada com o comando ng serve e, com isso, conseguimos visualizar o componente App no navegador. Agora entenderemos o que aconteceu durante este processo.
mvp
Aula 6 - mvp

Criando um componente com a Angular CLI

Criar um componente manualmente é um processo repetitivo e que envolve cuidado com certos detalhes. Uma vez que uma aplicação pode conter inúmeros componentes podemos facilitar sua criação automatizando os passos com a Angular CLI.
mvp
Aula 7 - mvp

Adicionando o Bootstrap

Veremos nesta aula como instalar no projeto o Bootstrap para, a partir dele, determinarmos como será a apresentação do componente painel-simples.
mvp
Aula 8 - mvp

Conhecendo o Input e o ng-content

Precisamos finalizar a criação do painel-simples, adicionando as classes do Bootstrap. Veremos como manipular o HTML com a sintaxe do Angular.
mvp
Aula 9 - mvp

Módulos

Veremos aqui um conceito fundamental na criação de componentes: por que declará-los em módulos? Com isso falaremos também sobre as motivações do Angular em adotar este mecanismo.
mvp
Aula 10 - mvp

Adicionando a Barra de Navegação

Em muitos casos precisamos construir a aplicação sobre um template pronto, que já contém algum HTML/CSS, porém ainda sem funcionalidade. Vamos iniciar a criação da interface do Dashboard, partindo da sua barra de navegação.
mvp
Aula 11 - mvp

Adicionando o Menu Lateral

Para finalizar a estrutura HTML básica da aplicação, adicionaremos nela o menu lateral, assim como fizemos no vídeo anterior.
mvp
Aula 12 - mvp

Criando a view Resumo

Adicionaremos a primeira página da aplicação, que apresentará um resumo do faturamento e das consultas para o usuário. Com isso veremos como o Angular cria uma view e agrupa nela diversos componentes.
mvp
Aula 13 - mvp

Manipulando classes do HTML

É bem comum precisarmos manipular o atributo class do elemento HTML quando desenvolvemos web sites. No Angular, contamos com uma sintaxe especial para isso que, aplicada ao HTML, nos permite resolver este problema.
mvp
Aula 14 - mvp

Pipes

Constantemente estamos manipulando o DOM em aplicações web e é bem comum querer tratar um dado vindo do servidor, seja filtrando elementos de um array ou formatando para valores monetários. Veremos como fazer isto com pipes.
mvp
Aula 15 - mvp

Criando a view consulta e o NgFor

Criaremos a view de consultas assim como vimos na apresentação do projeto. Posteriormente será necessário iterar numa lista e exibir cada item, para isto utilizaremos o NgFor.
mvp
Aula 16 - mvp

Melhorando a view consulta

Repetição de código não é bom. Identificando que temos o mesmo comportamento em mais de uma parte da aplicação, devemos abstrair essa funcionalidade em um componente e, então, utilizá-lo.
mvp

Certificado Devmedia

Todos os nossos cursos oferecem certificado com carga horária. Eles são aceitos em todas as faculdades e orgãos públicos do Brasil. Assim que finalizar um curso já emita o seu.

Suporte ao aluno em tempo real

Todos os cursos possuem professores online para ajudar em qualquer dúvida que for necessária para o completo entendimento do curso.

Desafios do curso

Angular: Declaração de componentes e serviços

Comprar
Saiba Mais Exclusivo para assinantes

Angular: Complete o código do componente

Comprar
Saiba Mais Exclusivo para assinantes

Avaliação do curso

Acesse todos os nossos cursos sendo um assinante mvp

Benefícios MVP
  • Guias de Carreira
  • Suporte em tempo real
  • Assista o conteúdo offline
  • Emissão de certificado
  • #JOBS - Diversas vagas de emprego
  • Web-currículo
SEJA MVP
R$ 69,90 /mês *Tempo mínimo de assinatura: 12 meses.
Assine agora e tenha acesso ao curso
15 anos de treinamento online
700 mil cadastros
200 mil fãs no facebook
100 mil certificados emitidos