‫Jusqu'à présent dans cette section, vous
‫avez appris comment exiger
‫les modules de base de Node JS.
‫Comment exiger vos propres modules.
‫Et donc
‫dans cette vidéo, vous allez
‫apprendre comment exiger des modules tiers du registre NPM.
‫En fait, exiger un module que
‫nous avons déjà installé à partir de
‫NPM est vraiment très simple.
‫Donc, encore une fois, nous faisons toutes les
‫exigences en haut et généralement nous avons besoin
‫des modules principaux
‫d'abord, puis des modules tiers,
‫puis des nôtres provenant de notre système
‫de fichiers local comme celui-ci.
‫Donc celui dont nous allons avoir
‫besoin s'appelle slugify.
‫Rappelles toi?
‫C'est celui que nous
‫avons installé dans le cours précédent.
‫Et tout ce que nous avons
‫à faire pour l'exiger, c'est
‫juste comme avant
‫d'utiliser la fonction require, puis simplement le nom du package.
‫Et puis OGS saura automatiquement qu'il devra
‫aller dans le
‫dossier des modules de nœud.
‫Donc, ce dossier où se trouvent toutes les dépendances
‫et recherchez ce module là-bas.
‫D'accord?
‫Encore une fois, cela renverra une variable.
‫Et nous devons donc enregistrer cela dans une variable.
‫Et je l'appelle slugify ici juste comme ça.
‫D'accord?
‫Et donc slugify sera une
‫fonction que nous pouvons utiliser pour créer des slugs.
‫Alors encore une fois, qu'est-ce qu'une limace?
‫Eh bien, slug n'est fondamentalement que la dernière
‫partie d'une URL qui contient une chaîne unique
‫qui identifie la ressource
‫que le site Web affiche.
‫Ainsi, par
‫exemple, dans notre ferme
‫de nœuds, disons que là où
‫nous avons ouvert cet avocat au lieu d'avoir cet
‫ID égal à zéro, nous pourrions
‫avoir quelque chose comme (en cliquant) sur des avocats frais, d'accord ?
‫Et donc cette partie ici ou
‫en fait juste cette
‫partie donc ce serait la limace.
‫Il s'agit donc essentiellement de
‫ce nom ici et ensuite basé sur une chaîne unique comme celle-ci.
‫Et je suis sûr que vous
‫avez vu cela partout, comme dans les articles de blog.
‫C'est très courant de faire comme ça.
‫Ou vraiment n'importe où où nous ne voulons pas simplement
‫quelque chose comme ça.
‫D'accord?
‫Donc ID est égal à un.
‫Ou nous pourrions aussi
‫simplement utiliser
‫par exemple dans ce cas ici chèvre et ainsi de suite.
‫D'accord.
‫Je ne vais pas faire un onglet sur le nom entier.
‫Mais l'idée est d'utiliser un slug, qui est
‫donc une chaîne unique au lieu d'un
‫simple nombre qui
‫n'a pas du tout de sens pour nous.
‫Disons maintenant que c'est
‫la première fois que vous utilisez le package slugify.
‫Et donc, afin de comprendre comment
‫cela fonctionne réellement, nous
‫pouvons rechercher la documentation ici
‫sur NPM.
‫Nous venons donc de mettre le nom du package ici.
‫Ensuite, recherchez-le.
‫Et c'est donc celui-ci que nous avons installé.
‫D'accord.
‫Nous avons donc déjà fait cette partie ici.
‫Nécessitant donc le module ou le package ici.
‫Et puis ici, nous pouvons voir comment
‫nous l'avons utilisé.
‫Donc, tout ce que nous
‫avons à faire est d'utiliser slugify comme fonction, puis
‫de passer une chaîne.
‫Ensuite, ici, vous voyez les options.
‫Et par exemple, nous pouvons spécifier le remplacement.
‫Donc, fondamentalement, par quoi l'espace vide
‫sera remplacé.
‫Et généralement c'est ce tiret.
‫Donc, tout comme je tapais ici.
‫Mais nous pouvons spécifier quelque chose
‫de différent comme un trait de soulignement ou rien du tout.
‫D'accord.
‫Ici, nous pouvons
‫spécifier que nous voulons tout en minuscule.
‫Et donc allons-y et faisons-le maintenant dans
‫notre code.
‫Nous avons donc
‫slugify ici et maintenant juste pour le
‫tester, faisons-le ici avant de créer le serveur.
‫Console au journal.
‫Slugify à la chaîne.
‫Avocats frais, puis je vais spécifier l'option
‫que je viens de vous montrer, qui est
‫en minuscule
‫et la définir sur true.
‫Sauvegardez-le
‫et rappelez-vous que nous n'avons
‫plus besoin de fermer
‫l'application et de la redémarrer.
‫Node man le fait automatiquement pour nous maintenant.
‫Et donc ici, vous voyez déjà des avocats frais.
‫J'ai simplement fait une erreur ici.
‫C'est donc en minuscule.
‫Mais cela ne fonctionne toujours pas
‫pour une raison quelconque, alors revenons ici.
‫Oh je vois.
‫C'est en fait juste plus bas.
‫Mais c'est exactement
‫à cela que sert la documentation.
‫Donc pour nous de voir comment quelque chose fonctionne vraiment afin
‫que nous puissions utiliser le package correctement
‫dans notre code.
‫Et donc
‫juste comme ça, j'ai créé une limace à partir de
‫notre première chaîne d'avocat frais.
‫Faisons maintenant cela pour tous nos produits.
‫Ils sont donc dans l'objet de données.
‫Créons donc un tableau de tous les slugs.
‫Alors les limaces.
‫Donc, carte de points d'objet de données.
‫Et c'est encore une fois juste du JavaScript
‫normal, donc cela ne devrait pas être rien pour vous.
‫Nous parcourons donc l'objet de données,
‫puis créons un nouveau tableau basé sur cela.
‫Et à chaque itération, ce que nous allons faire,
‫c'est prendre l'élément et ensuite
‫créer une limace à partir de cela.
‫Donc slugify élément dot nom du produit.
‫Alors n'oubliez pas que c'est là que se trouve
‫le nom du produit.
‫Donc ici vous voyez le nom du produit.
‫Et donc cet objet.
‫Et enregistrons en fait celui-ci sur la console.
‫Et en effet, nous y voilà.
‫Ce sont donc nos six
‫limaces ou en fait
‫seulement cinq de nos cinq produits.
‫D'accord.
‫Et c'est ainsi que nous
‫incluons un module tiers.
‫Jetez un œil à la
‫documentation, puis utilisez-la réellement dans notre code.
‫D'accord.
‫Donc, ce slugify est maintenant une dépendance de notre code.
‫Parce que sans
‫ce package, ce morceau de
‫code ici ne fonctionnerait plus.
‫Droit?
‫Notre code dépend donc
‫maintenant de l'installation du package slugify dans le projet.
‫Maintenant, nous pouvons aller de l'avant
‫et stocker ces slugs ici dans le json de données, puis
‫créer l'application
‫de sorte qu'au lieu
‫de l'ID, elle affiche le slug dans l'URL.
‫Mais je ne vais
‫pas continuer et faire ça ici parce
‫que c'est juste en utilisant les
‫mêmes concepts que nous avons appris auparavant.
‫Et donc ça n'apporte rien de nouveau.
‫Tout ce que je
‫voulais faire dans cette vidéo est vraiment de vous
‫montrer ce processus d'intégration d'un nouveau package dans notre code.
‫Jetez un œil à la
‫documentation, puis faites
‫un exemple simple avec ce nouveau module.
‫C'était donc le but de cette vidéo.
‫C'est terminé maintenant.
‫Et donc passons maintenant
‫au suivant.