Comment installer Angular 13 – Tutoriel

Last updated on 30 juin 2022


Récemment, la version stable d’Angular 13 est sortie ! Dans ce tutoriel, vous allez apprendre à installer Angular 13 sur votre machine, étape par étape, à partir du niveau débutant.

Heureusement, si vous avez déjà de l’expérience avec Angular 10, 11 ou 12, le processus de démarrage d’un nouveau projet Angular 13 est à peu près le même.

Cependant, si vous n’avez aucune expérience préalable avec Angular, ne vous inquiétez pas, l’installation d’Angular 13 est un jeu d’enfant.

Alors, c’est parti…

Prérequis

Vous allez avoir besoin de quelques éléments avant de commencer :

Remarque : Angular 13 nécessite Node.js version 16.x.

Node.js

Node Package Manager (npm)

Pour vérifier si vous avez installé ces deux éléments, rendez-vous sur votre ligne de commande ou votre Terminal et tapez :

node -v
npm -v

Si vous n’avez pas installé Node.js sur votre machine, allez simplement sur nodejs.org et téléchargez la dernière version stable (LTS : Long Terme Support, version stable bénéficiant de support sur une plus longue durée qu’une version standard) ou vous pouvez également utiliser la version actuelle et l’installer sur votre machine.

Installer Node JS en version LTS

Étape 1 : Installation d’Angular 13 par le CLI

L’interface CLI (Command Line Interface) d’Angular est le moyen le plus rapide et le plus facile de démarrer un projet Angular 13.

Nous pouvons utiliser Angular CLI pour créer de nouveaux projets, générer du code d’application et du code de bibliothèque, et aussi développer des tâches telles que la génération de composants, la création de bundle d’application, le déploiement, etc…

Nous allons utiliser npm pour installer le CLI Angular globalement à travers la commande suivante :

npm install -g @angular/cli

Une fois installé, vous pouvez accéder à l’outil CLI en tapant ng.

Pour vérifier la version de votre CLI Angular, tapez :

ng -version

Il montrera la version du CLI actuellement installé. Super maintenant nous avons installé le CLI et il est prêt à être utilisé avec Angular.

Étape 2 : Créer un projet vierge dans Angular 13 avec CLI

Maintenant, allez dans le répertoire où vous voulez placer le projet avec CLI et ensuite tapez :

ng new

Il vous demandera des informations sur les fonctionnalités à inclure dans le projet d’application initial. Acceptez les valeurs par défaut en appuyant sur la touche Entrée.

Cela prendra un certain temps, une fois l’installation terminée, allez dans le répertoire du projet et tapez :

ng -v

Il retournera la version actuelle d’Angular que nous avons installée et d’autres informations.

Étape 3 : Lancer l’application

Nous avons maintenant installé Angular 13 et vous pouvez exécuter le projet dans le navigateur en tapant :

ng serve

Et c’est tout ! Maintenant, allez dans votre navigateur et tapez “http://localhost:4200” et vous serez en mesure d’afficher l’écran suivant.

Si vous rencontrez des difficultés lors de la création d’un projet, essayez de vider le cache en utilisant la commande suivante et réinstallez ensuite Angular CLI

npm cache clean -force

puis exécutez

npm install -g @angular/cli@latest

A lire également,

Merci de votre lecture.

Faites-moi savoir si vous rencontrez des difficultés, n’hésitez pas à commenter ci-dessous j’aime vous aider. Si vous avez une suggestion de nouvel article ou tutoriel alors exprimez-vous en commentant.

N’oubliez pas de partager ce tutoriel avec vos amis sur Facebook et Twitter.

 

 


Crédit photo :
Photo de cottonbro provenant de Pexels


Soyez le premier à commenter

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.