Lors de la création d’un projet avec Angular CLI, une arborescence de dossiers et de fichiers bien structurée est générée. Cette structure joue un rôle essentiel dans l’organisation du code, rendant le développement plus efficace et scalable.

Présentation des dossiers clés et des fichiers créés automatiquement lors de l’initialisation d’un nouveau projet Angular.

Structure du projet

Lors de l’exécution de la commande ng new angular-app, Angular CLI génère la structure suivante :

📂 src/ – Code source de l’application.

Ce dossier contient les fichiers principaux et les configurations nécessaires à votre application Angular.

Code de l'application

Fichiers de configuration

Fichiers supplémentaires

Exécution d'une application Angular

Pour lancer votre application Angular, ouvrez d'abord le terminal. Dans VS Code, utilisez les raccourcis suivants :

• macOS : Cmd + J ou Cmd + ` ;

• Windows : Ctrl + J ou Cmd + `.

Vous pouvez également accéder à Affichage → Terminal dans le menu supérieur.

Ensuite, exécutez la commande suivante :

Cette commande compile le projet et démarre un serveur de développement local. Une fois le processus terminé, le terminal affichera un message avec une URL :

Ouvrez l'URL (http://localhost:4200/) dans votre navigateur pour afficher la page d'accueil Angular.