Aujourd'hui, je vais vous expliquer les bases de Node.js et de NPM, y compris des explications sur la façon de développer pour le Web en général. Juste une note à l'avance : si vous êtes familiarisé avec le développement Web de base et le NPM, vous pouvez ignorer cet article et en savoir plus sur le très utile NPX ici.
D'accord, super! Commençons!
Node.js
Si vous lisez ceci, vous avez probablement déjà téléchargé Node.js + NPM et commencé à vous plonger dans les eaux de Javascript. Pourtant, les premiers pas peuvent déjà sembler effrayants : "Je veux juste écrire un petit programme en Javascript, pourquoi ai-je besoin de tout le reste ?". C'est compréhensible, mais ce n'est vraiment pas grave du tout.
Commençons par le début : vous pouvez simplement créer un fichier Javascript partout sur votre ordinateur, indiqué par le suffixe ".js". Ce fichier peut être rempli de code comme vous le souhaitez, mais il manque une chose : comment exécutez-vous réellement votre programme ? C'est là que Node.js entre en jeu.
Node.js est un environnement d'exécution, explicitement pour Javascript. Comme la description l'indique, Node peut exécuter votre code Javascript dans un environnement spécifique que Node lui-même fournit. Le processus est toujours le même : vous démarrez d'abord Node.js, et lorsque Node est lancé (ce qui signifie qu'il a fini de démarrer), vous pouvez lui fournir votre code Javascript.
Votre Javascript peut être fourni à Node en tant qu'entrée de deux manières :
- Directement au processus Node en cours d'exécution, ligne par ligne, aucun fichier inclus
- En indiquant à Node quel fichier Javascript charger, sans aucune entrée ligne par ligne
node
Ligne par ligne
Après avoir installé Node.js avec succès (qui ne fait que télécharger + exécuter le programme d'installation, les descriptions sont sur le site Web de Node), vous pouvez démarrer Node.js de n'importe où dans votre terminal (macOS/Linux) ou PowerShell (Windows) . La commande ressemble à ceci.
Ouais, c'est tout ! Vous venez de lancer avec succès Node! Avez-vous remarqué à quelle vitesse cela s'est produit? L'une des raisons pour lesquelles Node.js est si populaire est précisément à cause de son démarrage incroyablement rapide (entre autres).
Maintenant que Node est opérationnel, nous pouvons définir notre application Javascript ligne par ligne. Chaque entrée est traitée et stockée en mémoire. Ici un petit exemple.
(Hit enter after every line end)
const greet = (name) => console.log("Hello, " + name);
greet("Tom"); let x = 10; x = x + 5;
(enter the following line to terminate node)
.exit
Maintenant, tout va bien, mais pour écrire des applications plus volumineuses, nous devons d'abord les rédiger dans des fichiers avant de les alimenter à Node. Chapitre suivant, s'il vous plait !
Saisie via fichiers
Pour cet exemple, vous avez besoin d'un éditeur de texte. Fondamentalement, vous pouvez utiliser tous les programmes capables de manipuler du texte (tels que TextEdit sur macOS ou Editor sur Windows). Je recommande le VS Code open source de Microsoft, mais vous pouvez choisir ce qui convient le mieux à votre ergonomie.
Pour fournir un fichier en entrée, il suffit d'en créer un. Créez simplement un fichier texte brut avec le suffixe "js" dans son nom. Nous nommerons notre fichier app.js. Ouvrez maintenant l'invite de commande de votre choix (celle utilisée dans notre premier exemple). Assurez-vous de l'ouvrir à partir du répertoire où le fichier est enregistré, c'est important.
Si vous utilisez VS Code, vous pouvez utiliser son invite de commande intégrée, faites simplement un clic droit dans votre vue Explorateur et appelez "Ouvrir dans le code" (sous Windows) ou faites glisser et déposez le répertoire contenant le fichier sur l'icône VS Code dans votre Dock (macOS). Ensuite, vous pouvez ouvrir son terminal comme décrit ici.
Lorsque le terminal est prêt, tapez simplement la commande suivante.
node app.js
Comme vous le voyez, certaines choses se sont produites :
- Le nœud a démarré directement, sans aucune entrée utilisateur disponible
- Node a exécuté tout votre fichier de haut en bas jusqu'à ce qu'il atteigne sa fin
- Le nœud lui-même s'est terminé, car la fin du fichier a également marqué la fin de son processus
Et pour une introduction de base à Node.js, c'est tout ! Une fois que vous avez téléchargé Node et que vous avez expérimenté pour la première fois l'utilisation de l'invite de commande pour lancer votre propre application Javascript, ligne par ligne ou à partir d'un fichier, vous êtes officiellement un développeur Javascript ! Bienvenue au club!
Je vais maintenant vous expliquer le concept de base du NMP. Après le prochain chapitre, nous verrons rapidement la connexion entre Node.js, NPM et le développement web. Si vous voulez en savoir plus sur Node.js, vous pouvez consulter nos histoires sur Javascript, les chaînes d'outils et tout ce qui concerne le codage ici. J'ai également lié quelques ressources utiles à la fin de cet article pour encore plus de choses à apprendre.
Très bien, déplaçons-en un !
NPM, le gestionnaire de paquets de nœuds
Comme vous l'avez vu, il n'est pas si difficile de gérer votre propre code. L'application peut être stockée dans un fichier, les modifications que vous appliquez restent. Mais que se passe-t-il si vous souhaitez utiliser le code de quelqu'un d'autre, par exemple une bibliothèque cryptographique ou de manipulation d'images ? Vous devez en quelque sorte mettre ce code à côté du vôtre, le rendre utilisable pour votre application et garder tout gérable.
Une approche naïve consisterait à simplement télécharger du code externe directement à partir de la source, par ex. Github, et copiez la bibliothèque, fichier par fichier, dans votre propre projet. Mais cela pose quelques problèmes :
- Comment mettre à jour au mieux ce code externe ? Copier à la main n'est pas la meilleure solution.
- Comment gardez-vous une trace de tout le code externe ?
- Et si ce code externe lui-même s'appuie sur des bibliothèques, qui ne sont pas installées dans votre projet ?
Tous ces défis sont relevés par NPM, un gestionnaire de packages pour Node.js. Le travail d'un gestionnaire de packages consiste essentiellement à vous fournir une solution robuste sur la façon d'ajouter, de suivre et de supprimer du code externe, également appelé dépendances. Voici quelques exemples de NMP en action.
npm install serve-static npm remove serve-static
Naturellement, ce gestionnaire a lui-même besoin de quelques fichiers spéciaux pour garder une trace de toutes les dépendances de votre projet. C'est pourquoi les applications utilisant NPM ont au moins deux fichiers : package.json ainsi que package-lock.json. Vous pouvez appeler la commande suivante pour créer rapidement un nouveau package NPM.
npm init -y
Remarque : comme nous l'avons vu dans la première partie de cet article, NPM n'est pas nécessaire pour utiliser Node.js ou Javascript. Son objectif est de gérer vos dépendances - ni plus, ni moins. Grâce à NPM, vous pouvez télécharger le code publié sur npmjs.com. Tous ces modules externes sont stockés dans votre projet dans un répertoire spécial appelé node_modules. Vous n'aurez pratiquement jamais à modifier ce répertoire, car il est entièrement géré par NPM.
Le package.json vous donne un aperçu de vos dépendances actuellement utilisées dans le projet. package-lock.json est un fichier spécial qui stocke certaines métadonnées sur les mutations concernant votre fichier package.json ou le répertoire node_modules et peut être ignoré pour le moment.
Je pense que je vais conclure ma description du concept même de NPM, de ce qu'il fait et des fichiers/répertoires qu'il génère automatiquement. De plus amples informations sont liées à la fin de l'article.
Arc au développement Web
Bravo, vous connaissez maintenant les fondamentaux de Node.js et NPM. Mais pourquoi diable tout cela est-il même nécessaire pour apprendre si vous voulez simplement commencer à créer votre propre site Web moderne ?
Comme nous venons de le voir, NPM nous permet de télécharger du code à partir d'une vaste collection de bibliothèques (la plus grande qui existe, pour être précis). Pour le développement Web, vous aurez besoin d'un serveur capable d'héberger (c'est-à-dire de fournir) votre application Web. Il existe de nombreux services disponibles où vous pouvez télécharger votre projet de site Web et utiliser une infrastructure existante, y compris des serveurs, pour rendre le site Web disponible sur le Web.
Et pour le développement local, un serveur est également nécessaire pour charger vos fichiers locaux et les rendre disponibles uniquement pour vous, sur votre appareil, pendant le développement. Grâce à Node.js, vous pouvez simplement faire cela : rendre votre site Web disponible localement via un soi-disant localhost. Node.js dispose des outils intégrés nécessaires pour lancer un serveur local, mais grâce à NPM, votre application peut être enrichie avec des composants testés au combat qui peuvent vous aider à créer de très grands services en peu de temps.
Bien sûr, ce n'est que le début : NPM héberge tellement de code pour créer des applications Web modernes (connues sous le nom de PWA, « application Web progressive ») ainsi que des serveurs complexes. Mais pour une première introduction, je pense que cette explication devrait suffire.
J'espère que je pourrais vous aider à maîtriser Node.js et NPM. Les premiers pas sont toujours les plus difficiles, mais mordre les premiers jours de développement et (beaucoup) d'apprentissage sera récompensé par l'expansion de vos compétences dans le développement d'applications Web modernes, vous permettant de construire ce que vous voulez.
