Installez les dépendances

Il vous faudra quelques outils indispensables pour du développement Angular en toute tranquillité.

Ce cours ne parlera pas de l'installation ou de la configuration d'un IDE. Si vous n'avez pas encore d'IDE, je vous conseille de suivre mon cours rapide Mettez en place votre environnement front-end avant de poursuivre.

Installez Node et npm

Dans ce cours, on utilisera le Node Package Manager, ou npm. Vous pouvez télécharger et installer la version LTS de Node sur  https://nodejs.org/fr/ , ce qui installera également npm.

LTS signifie Long Term Support : il s'agit d'une version stable spécifique qui bénéficiera de support pendant plus longtemps qu'une version standard. Angular précise qu'il est compatible avec les versions LTS de Node.

Installez le CLI d'Angular

Le CLI (Command Line Interface, ou interface en ligne de commande) d'Angular est un outil indispensable pour créer, gérer et déployer les applications Angular. Installez-le globalement sur votre ordinateur depuis une ligne de commande avec :npm i -g @angular/cli

Le  i  est un raccourci pourinstall, et le  -g  dit à npm que vous voulez installer ce package de manière globale.

Si vous êtes sur Mac, il est possible que vous ayez des erreurs EACCES lors de l'installation. Si c'est le cas, suivez le guide dans la  documentation npm  et réessayez.

Une fois l'installation terminée, vous pouvez taper :

ng v

pour afficher les détails de la version installée, la commande  ng  correspondant au CLI d'Angular.

Si vous êtes à l'aise avec l'installation d'outils sur votre machine, je vous propose de regarder NVM (Node Version Manager) comme outil pour gérer l'installation de Node.

Sur macOS/Linux :
https://github.com/nvm-sh/nvm?tab=readme-ov-file#install--update-script

Sur Windows :
https://github.com/coreybutler/nvm-windows

Cet outil permet notamment aux utilisateurs macOS/Linux d'éviter tout problème potentiel de droits.

Faites votre choix d'IDE et de navigateur

Je ne rentrerai pas dans la guerre des éditeurs de code ! Utilisez l'éditeur avec lequel vous êtes le plus à l'aise. Si vous utilisez un éditeur simple au lieu d'un IDE, je vous suggère fortement d'essayer un IDE (VS Code est disponible gratuitement), simplement parce que les éditeurs plus avancés proposent des fonctionnalités qui vous faciliteront la vie – l'autocomplétion, la refactorisation automatique, l'intégration Git…

Dans les screencasts de ce cours, j'utiliserai WebStorm, car c'est mon outil de travail principal. Il s'agit d'un outil payant ; il existe (au moment de l'écriture de ce cours) une version d'évaluation gratuite de 30 jours si vous voulez l'essayer. De toute manière, sachez que VS Code reste un outil professionnel qui vous permettra de tout faire !

Angular fonctionne sur tous les navigateurs modernes. Dans ce cours, j'utiliserai Chrome pour le développement parce que c'est mon outil habituel. Vous pouvez utiliser le navigateur que vous voulez, tant que vous êtes à l'aise avec ses outils de développeur (console, réseau, inspecteur d'éléments, etc.).

En résumé

•               Pour installer le CLI d'Angular, il vous faut une version LTS de Node et npm.

•               On installe le CLI avec la commande  npm i -g @angular/cli

•               On peut vérifier la version installée du CLI avec  ng v

  •  

•       Dans le prochain chapitre, vous allez vous servir du CLI pour créer votre premier projet Angular. À tout de suite !