Ao criar um projeto usando o Angular CLI, é gerada uma estrutura de pastas e arquivos bem organizada. Essa estrutura desempenha um papel fundamental na organização do código, tornando o desenvolvimento mais eficiente e escalável.

Serão exploradas as principais pastas e arquivos que são criados automaticamente ao configurar um novo projeto Angular.

Estrutura do Projeto

Ao executar o comando ng new angular-app, o Angular CLI gera a seguinte estrutura:

📂 src/ – Código-fonte da Aplicação.

Esta pasta contém os arquivos principais e as configurações necessárias para a sua aplicação Angular.

Código da Aplicação

Arquivos de Configuração

Arquivos Adicionais

Executando uma Aplicação Angular

Para iniciar seu app Angular, primeiro abra o terminal. No VS Code, utilize estes atalhos:

• macOS: Cmd + J ou Cmd + `;

• Windows: Ctrl + J ou Cmd + `.

Alternativamente, acesse Exibir → Terminal no menu superior.

Agora, execute o seguinte comando:

Este comando compila o projeto e inicia um servidor de desenvolvimento local. Após a conclusão do processo, o terminal exibirá uma mensagem com um URL:

Abra o URL (http://localhost:4200/) no seu navegador para visualizar a página de boas-vindas do Angular.