Destino Dev

Cursos

Angular Básico: Componentes e Módulos

Código do curso: github.com/johnpires/angular-basico-componentes-e-modulos

Angular é um dos frameworks mais robustos e amplamente utilizados no desenvolvimento web moderno. Neste curso de nível iniciante, você vai aprender os fundamentos essenciais do Angular, desde a instalação e configuração do ambiente de desenvolvimento até a criação de componentes reutilizáveis e a organização de sua aplicação com módulos. O foco é garantir que você construa uma base sólida para avançar no ecossistema Angular com confiança.

Durante o curso, você vai entender como o Angular organiza aplicações através de componentes, como funciona o sistema de templates com data binding, e como utilizar diretivas como *ngIf e *ngFor para renderização condicional e listas. Você também vai aprender sobre a comunicação entre componentes com @Input e @Output, além de criar serviços simples com injeção de dependência e configurar roteamento básico.

Ao final do curso, você terá desenvolvido uma aplicação completa de Lista de Tarefas utilizando todos os conceitos aprendidos. O projeto final servirá como portfólio e demonstração prática das suas habilidades com Angular, preparando você para avançar para tópicos mais complexos como RxJS, formulários reativos e integração com APIs REST.

Conteúdo do curso

Módulo 1: Introdução ao Angular

Neste módulo você vai entender o que é o Angular, como configurar o ambiente de desenvolvimento e criar seu primeiro componente.

  1. O que é Angular e por que usar? (8 min)
  2. Instalando Node.js, Angular CLI e criando o primeiro projeto (8 min)
  3. Estrutura de pastas do projeto Angular (8 min)
  4. O que são Componentes? Conceitos fundamentais (8 min)
  5. Criando e usando seu primeiro componente (8 min)

Módulo 2: Templates e Data Binding

Aprenda interpolação, property binding, event binding, two-way binding e diretivas estruturais *ngIf e *ngFor.

  1. Interpolação e expressões de template (8 min)
  2. Property Binding: conectando dados ao HTML (8 min)
  3. Event Binding: reagindo a eventos do usuário (8 min)
  4. Two-Way Binding e Diretivas *ngIf e *ngFor (8 min)
  5. Diretivas de Atributo: ngClass e ngStyle (8 min)

Módulo 3: Comunicação entre Componentes e Módulos

Entenda como os componentes se comunicam usando @Input e @Output, NgModules e injeção de dependência com serviços.

  1. Comunicação pai → filho com @Input (8 min)
  2. Comunicação filho → pai com @Output e EventEmitter (8 min)
  3. NgModules: organizando a aplicação (8 min)
  4. Serviços e Injeção de Dependência (8 min)
  5. Lifecycle Hooks: ciclo de vida dos componentes (8 min)

Módulo 4: Projeto Final: Lista de Tarefas com Angular

Aplique todos os conhecimentos construindo uma aplicação completa de Lista de Tarefas com componentes, serviços e roteamento básico.

  1. Planejando o projeto: estrutura e requisitos (8 min)
  2. Implementando o serviço de tarefas com LocalStorage (8 min)
  3. Criando os componentes da aplicação (8 min)
  4. Integrando tudo no AppComponent (8 min)
  5. Estilizando e publicando a aplicação (2 min)