« Gestion des dependencies » : différence entre les versions
(→npm) |
|||
Ligne 16 : | Ligne 16 : | ||
==Logiciels de gestion de dependencies== | ==Logiciels de gestion de dependencies== | ||
===npm=== | ===npm=== | ||
''npm'' est l'acronyme de '''''Node Package Manager'''.'' C'est un gestionnaires de paquets open source pour les projets javascript et plus particulièrement [[Node.js]]. Ce logiciel permet de télécharger puis d'installer les dépendances (third party code) nécessaire à un projet. En plus du développement, npm est primordial pour la maintenance du projet. | |||
==== Installation ==== | ==== Installation ==== | ||
Ligne 27 : | Ligne 27 : | ||
<code>npm init</code> | <code>npm init</code> | ||
ou si vous voulez lancer votre projet avec les paramètres par défaut: | |||
<code>npm init -y</code> | |||
Ces commandes vont permettre de lancer un assistant de configuration pour créer un fichier ''package.json'' avec les paramètres de votre projet (nom, auteur, version, description etc.) | |||
Une fois le projet lancer, vous pourrez installer divers paquets avec la commande <code>npm</code> | |||
==== Installer un paquet ==== | |||
Pour les besoins d'un projet, il est possible de rechercher un paquet développer par un tiers pour réutiliser le code externe. En se rendant sur https://www.npmjs.com/, il suffit de rechercher dans la barre de recherche ce dont on a besoin. | |||
Par exemple, si l'on aimerait du code nous permettant de faire des Qr code dans notre projet, dans la barre de recherche nous allons chercher "''QR Code''". Cela va nous renvoyer plusieurs résultat et il faudra choisir celui qui convient. Chaque développeur qui met à disposition son code, propose un tutoriel, avec les lignes de commandes, pour installer son paquet dans notre projet. | |||
===yarn=== | ===yarn=== | ||
===webpack=== | ===webpack=== | ||
Version du 2 février 2023 à 12:36
Introduction
Dans un projet de développement web, il y a la possibilité d'utiliser du third party code. C'est du code qui a été mis à disposition par des développeurs extérieur au projet. Pour intégrer ces bibliothèques et composants tiers, il y a la possibilité de télécharger les fichiers manuellement et de les téléverser sur son serveur web (voir Démo incorporation de third-party code dans un projet dans STIC I - exercice 6 (Concordia)).
L'autre méthode est d'utiliser un Content Delivery Network, CDN qui implique de simplement mettre un lien dans le code renvoyant à ce code externe.
La dernière méthode, celle qui va être présenter sur cette page, consiste à utiliser des logiciels de gestion de dependencies (dépendances). comme:
Ces outils permettent de gérer facilement les dépendances dans un projet de développement web.
Logiciels de gestion de dependencies
npm
npm est l'acronyme de Node Package Manager. C'est un gestionnaires de paquets open source pour les projets javascript et plus particulièrement Node.js. Ce logiciel permet de télécharger puis d'installer les dépendances (third party code) nécessaire à un projet. En plus du développement, npm est primordial pour la maintenance du projet.
Installation
Pour installer npm sur une machine, il suffit d'installer Node.js sur le système. En effet, npm est inclus par défaut.
Pour installer Node.js, vous pouvez suivre les étapes sur la page EdutechWiki Node.js.
Démarrer un projet avec npm
Dans le dossier de votre projet, que vous avez préalablement ouvert avec un éditeur de texte (par exemple: Visual studio code), lancez le terminal de commande et utiliser la commande suivante:
npm init
ou si vous voulez lancer votre projet avec les paramètres par défaut:
npm init -y
Ces commandes vont permettre de lancer un assistant de configuration pour créer un fichier package.json avec les paramètres de votre projet (nom, auteur, version, description etc.)
Une fois le projet lancer, vous pourrez installer divers paquets avec la commande npm
Installer un paquet
Pour les besoins d'un projet, il est possible de rechercher un paquet développer par un tiers pour réutiliser le code externe. En se rendant sur https://www.npmjs.com/, il suffit de rechercher dans la barre de recherche ce dont on a besoin.
Par exemple, si l'on aimerait du code nous permettant de faire des Qr code dans notre projet, dans la barre de recherche nous allons chercher "QR Code". Cela va nous renvoyer plusieurs résultat et il faudra choisir celui qui convient. Chaque développeur qui met à disposition son code, propose un tutoriel, avec les lignes de commandes, pour installer son paquet dans notre projet.