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

O que é Angular CLI?

Ele permite:

• Criar rapidamente novos projetos com uma estrutura predefinida;

• Gerar componentes, serviços e outros elementos do projeto;

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

• Construir a 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.

Configurando seu Espaço de Trabalho

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

Se você não possui 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 usar 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 tópico será abordado posteriormente, então, por enquanto, selecione Yes;

• Qual formato de folha de estilo você gostaria de usar? - isso determina o tipo de folha de estilo 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 enquanto baixa e instala 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, você pode abrir o projeto no VS Code, que instalamos anteriormente.

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