Agora que todas as ferramentas necessárias, incluindo Node.js, VS Code e Angular CLI, estão instaladas, é o momento de criar seu primeiro projeto e observar como o Angular CLI simplifica o processo de desenvolvimento.

O que é o Angular CLI?

Ele permite:

• Criação rápida de novos projetos com uma estrutura predefinida;

• Geração de componentes, serviços e outros elementos do projeto;

• Inicialização de um servidor de desenvolvimento para testes e depuração;

• Compilação da aplicação para implantação em produção.

Com o Angular CLI, não é necessário configurar manualmente arquivos e dependências—tudo é configurado automaticamente.

Configuração do Espaço de Trabalho

Antes de criar um novo projeto, selecione um local conveniente em seu computador onde deseja armazenar seus projetos Angular.

Caso não possua uma pasta dedicada para projetos, crie uma utilizando o seguinte comando:

Este comando cria uma nova pasta chamada projects no local especificado.

Em seguida, navegue até a pasta recém-criada executando:

Este comando abre a pasta projects, permitindo que você trabalhe dentro dela.

Criando um Projeto Angular com CLI

Para criar um novo projeto Angular, execute o seguinte comando dentro da sua pasta do projeto:

• ng new - o comando para criar um novo projeto Angular;

• angular-app - o nome do projeto (você pode utilizar qualquer nome de sua preferência).

Após executar o comando, o Angular CLI apresentará algumas perguntas de configuração:

• Deseja adicionar o roteamento Angular? - este assunto será abordado posteriormente, portanto, selecione Yes por enquanto;

• Qual formato de folha de estilo você deseja utilizar? - esta opção define o tipo de folha de estilos para o seu projeto. Recomenda-se escolher CSS, mas você pode selecionar a opção que preferir.

Após confirmar essas opções, o Angular CLI iniciará a instalação das dependências. Esse processo pode levar alguns minutos, pois serão baixados e instalados todos os pacotes necessários.

Quando a configuração for concluída, uma mensagem de sucesso será exibida, indicando que o projeto foi criado com êxito.

Agora, é possível abrir o projeto no VS Code, que foi instalado anteriormente.

No próximo capítulo, será feita uma análise detalhada da estrutura de pastas e arquivos gerada pelo Angular CLI para compreender como um projeto Angular é organizado e onde as principais partes da aplicação estão localizadas.