Dicas de Angular

Aprenda a preparar o ambiente, criar o projeto em Angular 21, configurar VS Code e montar o layout inicial de uma app financeira.

Neste vídeo você vai começar a desenvolver uma aplicação em **Angular 21** para **consulta de dados do mercado financeiro** com foco em aprendizado prático, organização do projeto e preparação para exibir **gráficos de cotações**. A proposta é construir uma aplicação frontend sem backend, consumindo dados de uma API de mercado financeiro, com destaque para conceitos atuais do ecossistema Angular, como:

- preparação do ambiente de desenvolvimento;
- verificação de versões do **Angular**, **Node. js** e **npm**;
- instalação e atualização do **Angular CLI**;
- criação de um novo projeto com `ng new`;
- uso do **Visual Studio Code** e extensões recomendadas;
- visão geral da estrutura de arquivos do projeto Angular;
- execução, build e hotreload da aplicação;
- criação e ajuste do layout inicial da tela principal;
- introdução ao uso de **Signals** nas versões mais novas do Angular;
- planejamento da aplicação para integração com API financeira e exibição de gráficos


Ao longo do conteúdo, também são comentadas novidades do **Angular 21**, como abordagem **zoneless por padrão**, melhorias em templates, testes e integração com recursos de IA no momento da criação do projeto. Este é o ponto de partida para a construção de uma app financeira que evoluirá para consultas de ações, criação de serviços HTTP, componentes reutilizáveis e visualização gráfica de séries de cotação.


## O que você verá neste vídeo

- Como preparar o ambiente para Angular 21
- Como instalar Node.js, npm e Angular CLI
- Como criar um projeto Angular do zero
- Como abrir e organizar o projeto no VS Code
- Como entender os principais arquivos gerados
- Como rodar a aplicação localmente
- Como modificar o `app.html` e o `app.scss`
- Como montar o layout inicial da aplicação financeira

# Capítulos

00:00:00 - API Alpha Vantage e dados do mercado financeiro (Introdução)
00:03:46 - Novidades do Angular 21
00:05:16 - Preparando o ambiente de desenvolvimento (Angular, Node, npm, VSCode)
00:05:42 - Como verificar a versão do Angular com ng version
00:06:30 - Como verificar a versão do Node.js e npm
00:07:38 - Onde baixar e instalar o Node.js
00:08:23 - Como instalar ou atualizar o Angular CLI
00:10:02 - Instalação do Visual Studio Code
00:10:43 - Criando a aplicação Angular com ng new
00:12:41 - Opções do projeto: SSR e arquivos para IA
00:14:18 - Git e abertura do projeto no VS Code
00:14:54 - Profiles e organização do VS Code por tecnologia
00:16:02 - Estrutura de arquivos Angular (index.html, main.ts, editor, Git, prettier e Angular)
00:21:04 - Extensões recomendadas para Angular no VS Code
00:22:16 - Build da aplicação com ng build
00:23:09 - Scripts do package.json e comandos npm
00:24:07 - Executando a aplicação com ng serve
00:25:17 - Criando a estrutura HTML inicial da página (app.html, select, button)
00:28:58 - Estilizando a aplicação com SCSS (classes, layout e responsividade básica)