﻿1
00:00:01,370 --> 00:00:03,150
‫Jusqu'à présent dans cette section, vous

2
00:00:03,150 --> 00:00:04,790
‫avez appris comment exiger

3
00:00:04,790 --> 00:00:06,720
‫les modules de base de Node JS.

4
00:00:06,720 --> 00:00:09,330
‫Comment exiger vos propres modules.

5
00:00:09,330 --> 00:00:10,210
‫Et donc

6
00:00:10,210 --> 00:00:12,050
‫dans cette vidéo, vous allez

7
00:00:12,050 --> 00:00:15,483
‫apprendre comment exiger des modules tiers du registre NPM.

8
00:00:17,440 --> 00:00:19,863
‫En fait, exiger un module que

9
00:00:19,863 --> 00:00:22,530
‫nous avons déjà installé à partir de

10
00:00:22,530 --> 00:00:24,610
‫NPM est vraiment très simple.

11
00:00:24,610 --> 00:00:27,380
‫Donc, encore une fois, nous faisons toutes les

12
00:00:27,380 --> 00:00:30,230
‫exigences en haut et généralement nous avons besoin

13
00:00:30,230 --> 00:00:31,690
‫des modules principaux

14
00:00:31,690 --> 00:00:33,410
‫d'abord, puis des modules tiers,

15
00:00:33,410 --> 00:00:35,980
‫puis des nôtres provenant de notre système

16
00:00:35,980 --> 00:00:37,793
‫de fichiers local comme celui-ci.

17
00:00:38,940 --> 00:00:41,740
‫Donc celui dont nous allons avoir

18
00:00:41,740 --> 00:00:43,360
‫besoin s'appelle slugify.

19
00:00:43,360 --> 00:00:45,000
‫Rappelles toi?

20
00:00:45,000 --> 00:00:46,400
‫C'est celui que nous

21
00:00:46,400 --> 00:00:48,350
‫avons installé dans le cours précédent.

22
00:00:48,350 --> 00:00:50,780
‫Et tout ce que nous avons

23
00:00:50,780 --> 00:00:52,510
‫à faire pour l'exiger, c'est

24
00:00:52,510 --> 00:00:54,120
‫juste comme avant

25
00:00:54,120 --> 00:00:57,770
‫d'utiliser la fonction require, puis simplement le nom du package.

26
00:00:57,770 --> 00:01:00,010
‫Et puis OGS saura automatiquement qu'il devra

27
00:01:00,010 --> 00:01:01,450
‫aller dans le

28
00:01:01,450 --> 00:01:02,993
‫dossier des modules de nœud.

29
00:01:03,920 --> 00:01:07,260
‫Donc, ce dossier où se trouvent toutes les dépendances

30
00:01:07,260 --> 00:01:09,353
‫et recherchez ce module là-bas.

31
00:01:11,470 --> 00:01:12,610
‫D'accord?

32
00:01:12,610 --> 00:01:17,430
‫Encore une fois, cela renverra une variable.

33
00:01:17,430 --> 00:01:20,483
‫Et nous devons donc enregistrer cela dans une variable.

34
00:01:22,860 --> 00:01:27,860
‫Et je l'appelle slugify ici juste comme ça.

35
00:01:27,910 --> 00:01:28,743
‫D'accord?

36
00:01:28,743 --> 00:01:30,940
‫Et donc slugify sera une

37
00:01:30,940 --> 00:01:34,630
‫fonction que nous pouvons utiliser pour créer des slugs.

38
00:01:34,630 --> 00:01:37,260
‫Alors encore une fois, qu'est-ce qu'une limace?

39
00:01:37,260 --> 00:01:40,730
‫Eh bien, slug n'est fondamentalement que la dernière

40
00:01:40,730 --> 00:01:44,030
‫partie d'une URL qui contient une chaîne unique

41
00:01:44,030 --> 00:01:46,130
‫qui identifie la ressource

42
00:01:46,130 --> 00:01:48,263
‫que le site Web affiche.

43
00:01:49,310 --> 00:01:50,590
‫Ainsi, par

44
00:01:50,590 --> 00:01:52,380
‫exemple, dans notre ferme

45
00:01:52,380 --> 00:01:54,810
‫de nœuds, disons que là où

46
00:01:54,810 --> 00:01:58,750
‫nous avons ouvert cet avocat au lieu d'avoir cet

47
00:01:58,750 --> 00:02:01,190
‫ID égal à zéro, nous pourrions

48
00:02:01,190 --> 00:02:05,980
‫avoir quelque chose comme (en cliquant) sur des avocats frais, d'accord ?

49
00:02:05,980 --> 00:02:08,290
‫Et donc cette partie ici ou

50
00:02:08,290 --> 00:02:10,330
‫en fait juste cette

51
00:02:10,330 --> 00:02:12,910
‫partie donc ce serait la limace.

52
00:02:12,910 --> 00:02:15,150
‫Il s'agit donc essentiellement de

53
00:02:15,150 --> 00:02:19,420
‫ce nom ici et ensuite basé sur une chaîne unique comme celle-ci.

54
00:02:19,420 --> 00:02:20,830
‫Et je suis sûr que vous

55
00:02:20,830 --> 00:02:23,090
‫avez vu cela partout, comme dans les articles de blog.

56
00:02:23,090 --> 00:02:25,830
‫C'est très courant de faire comme ça.

57
00:02:25,830 --> 00:02:30,830
‫Ou vraiment n'importe où où nous ne voulons pas simplement

58
00:02:30,900 --> 00:02:33,053
‫quelque chose comme ça.

59
00:02:33,990 --> 00:02:34,823
‫D'accord?

60
00:02:34,823 --> 00:02:36,190
‫Donc ID est égal à un.

61
00:02:36,190 --> 00:02:38,130
‫Ou nous pourrions aussi

62
00:02:38,130 --> 00:02:39,580
‫simplement utiliser

63
00:02:40,830 --> 00:02:45,712
‫par exemple dans ce cas ici chèvre et ainsi de suite.

64
00:02:45,712 --> 00:02:46,683
‫D'accord.

65
00:02:46,683 --> 00:02:47,630
‫Je ne vais pas faire un onglet sur le nom entier.

66
00:02:47,630 --> 00:02:50,120
‫Mais l'idée est d'utiliser un slug, qui est

67
00:02:50,120 --> 00:02:52,400
‫donc une chaîne unique au lieu d'un

68
00:02:52,400 --> 00:02:53,820
‫simple nombre qui

69
00:02:53,820 --> 00:02:56,530
‫n'a pas du tout de sens pour nous.

70
00:02:56,530 --> 00:02:58,660
‫Disons maintenant que c'est

71
00:02:58,660 --> 00:03:02,200
‫la première fois que vous utilisez le package slugify.

72
00:03:02,200 --> 00:03:04,500
‫Et donc, afin de comprendre comment

73
00:03:04,500 --> 00:03:06,100
‫cela fonctionne réellement, nous

74
00:03:06,100 --> 00:03:07,870
‫pouvons rechercher la documentation ici

75
00:03:07,870 --> 00:03:09,173
‫sur NPM.

76
00:03:10,920 --> 00:03:15,323
‫Nous venons donc de mettre le nom du package ici.

77
00:03:16,770 --> 00:03:18,210
‫Ensuite, recherchez-le.

78
00:03:18,210 --> 00:03:20,473
‫Et c'est donc celui-ci que nous avons installé.

79
00:03:22,300 --> 00:03:23,510
‫D'accord.

80
00:03:23,510 --> 00:03:25,710
‫Nous avons donc déjà fait cette partie ici.

81
00:03:25,710 --> 00:03:29,347
‫Nécessitant donc le module ou le package ici.

82
00:03:29,347 --> 00:03:31,240
‫Et puis ici, nous pouvons voir comment

83
00:03:31,240 --> 00:03:32,150
‫nous l'avons utilisé.

84
00:03:32,150 --> 00:03:33,580
‫Donc, tout ce que nous

85
00:03:33,580 --> 00:03:36,320
‫avons à faire est d'utiliser slugify comme fonction, puis

86
00:03:36,320 --> 00:03:37,653
‫de passer une chaîne.

87
00:03:39,740 --> 00:03:42,940
‫Ensuite, ici, vous voyez les options.

88
00:03:42,940 --> 00:03:46,690
‫Et par exemple, nous pouvons spécifier le remplacement.

89
00:03:46,690 --> 00:03:49,140
‫Donc, fondamentalement, par quoi l'espace vide

90
00:03:49,140 --> 00:03:50,600
‫sera remplacé.

91
00:03:50,600 --> 00:03:52,080
‫Et généralement c'est ce tiret.

92
00:03:52,080 --> 00:03:54,343
‫Donc, tout comme je tapais ici.

93
00:03:55,770 --> 00:03:57,710
‫Mais nous pouvons spécifier quelque chose

94
00:03:57,710 --> 00:04:00,853
‫de différent comme un trait de soulignement ou rien du tout.

95
00:04:02,210 --> 00:04:03,043
‫D'accord.

96
00:04:03,043 --> 00:04:04,330
‫Ici, nous pouvons

97
00:04:04,330 --> 00:04:06,340
‫spécifier que nous voulons tout en minuscule.

98
00:04:06,340 --> 00:04:08,390
‫Et donc allons-y et faisons-le maintenant dans

99
00:04:08,390 --> 00:04:09,393
‫notre code.

100
00:04:10,390 --> 00:04:11,700
‫Nous avons donc

101
00:04:11,700 --> 00:04:13,940
‫slugify ici et maintenant juste pour le

102
00:04:13,940 --> 00:04:16,513
‫tester, faisons-le ici avant de créer le serveur.

103
00:04:20,310 --> 00:04:21,543
‫Console au journal.

104
00:04:22,900 --> 00:04:25,803
‫Slugify à la chaîne.

105
00:04:29,160 --> 00:04:31,680
‫Avocats frais, puis je vais spécifier l'option

106
00:04:31,680 --> 00:04:34,410
‫que je viens de vous montrer, qui est

107
00:04:34,410 --> 00:04:35,630
‫en minuscule

108
00:04:38,140 --> 00:04:40,120
‫et la définir sur true.

109
00:04:40,120 --> 00:04:40,953
‫Sauvegardez-le

110
00:04:41,880 --> 00:04:43,660
‫et rappelez-vous que nous n'avons

111
00:04:43,660 --> 00:04:45,060
‫plus besoin de fermer

112
00:04:45,060 --> 00:04:46,850
‫l'application et de la redémarrer.

113
00:04:46,850 --> 00:04:49,760
‫Node man le fait automatiquement pour nous maintenant.

114
00:04:49,760 --> 00:04:53,520
‫Et donc ici, vous voyez déjà des avocats frais.

115
00:04:53,520 --> 00:04:55,550
‫J'ai simplement fait une erreur ici.

116
00:04:55,550 --> 00:04:57,800
‫C'est donc en minuscule.

117
00:04:57,800 --> 00:04:59,700
‫Mais cela ne fonctionne toujours pas

118
00:04:59,700 --> 00:05:01,659
‫pour une raison quelconque, alors revenons ici.

119
00:05:01,659 --> 00:05:02,492
‫Oh je vois.

120
00:05:02,492 --> 00:05:04,203
‫C'est en fait juste plus bas.

121
00:05:06,300 --> 00:05:07,460
‫Mais c'est exactement

122
00:05:07,460 --> 00:05:09,250
‫à cela que sert la documentation.

123
00:05:09,250 --> 00:05:11,890
‫Donc pour nous de voir comment quelque chose fonctionne vraiment afin

124
00:05:11,890 --> 00:05:13,640
‫que nous puissions utiliser le package correctement

125
00:05:13,640 --> 00:05:14,773
‫dans notre code.

126
00:05:15,640 --> 00:05:16,687
‫Et donc

127
00:05:16,687 --> 00:05:20,090
‫juste comme ça, j'ai créé une limace à partir de

128
00:05:20,090 --> 00:05:22,053
‫notre première chaîne d'avocat frais.

129
00:05:23,040 --> 00:05:26,300
‫Faisons maintenant cela pour tous nos produits.

130
00:05:26,300 --> 00:05:28,250
‫Ils sont donc dans l'objet de données.

131
00:05:28,250 --> 00:05:30,763
‫Créons donc un tableau de tous les slugs.

132
00:05:32,390 --> 00:05:33,383
‫Alors les limaces.

133
00:05:34,470 --> 00:05:38,000
‫Donc, carte de points d'objet de données.

134
00:05:38,000 --> 00:05:40,460
‫Et c'est encore une fois juste du JavaScript

135
00:05:40,460 --> 00:05:43,340
‫normal, donc cela ne devrait pas être rien pour vous.

136
00:05:43,340 --> 00:05:45,710
‫Nous parcourons donc l'objet de données,

137
00:05:45,710 --> 00:05:48,163
‫puis créons un nouveau tableau basé sur cela.

138
00:05:49,360 --> 00:05:52,100
‫Et à chaque itération, ce que nous allons faire,

139
00:05:52,100 --> 00:05:53,860
‫c'est prendre l'élément et ensuite

140
00:05:53,860 --> 00:05:55,933
‫créer une limace à partir de cela.

141
00:05:57,060 --> 00:06:01,623
‫Donc slugify élément dot nom du produit.

142
00:06:04,640 --> 00:06:07,390
‫Alors n'oubliez pas que c'est là que se trouve

143
00:06:07,390 --> 00:06:08,740
‫le nom du produit.

144
00:06:08,740 --> 00:06:10,713
‫Donc ici vous voyez le nom du produit.

145
00:06:12,130 --> 00:06:15,433
‫Et donc cet objet.

146
00:06:21,407 --> 00:06:25,223
‫Et enregistrons en fait celui-ci sur la console.

147
00:06:28,320 --> 00:06:30,480
‫Et en effet, nous y voilà.

148
00:06:30,480 --> 00:06:32,790
‫Ce sont donc nos six

149
00:06:32,790 --> 00:06:34,670
‫limaces ou en fait

150
00:06:34,670 --> 00:06:37,100
‫seulement cinq de nos cinq produits.

151
00:06:37,100 --> 00:06:37,933
‫D'accord.

152
00:06:37,933 --> 00:06:40,210
‫Et c'est ainsi que nous

153
00:06:40,210 --> 00:06:42,061
‫incluons un module tiers.

154
00:06:42,061 --> 00:06:44,430
‫Jetez un œil à la

155
00:06:44,430 --> 00:06:47,190
‫documentation, puis utilisez-la réellement dans notre code.

156
00:06:47,190 --> 00:06:48,160
‫D'accord.

157
00:06:48,160 --> 00:06:52,760
‫Donc, ce slugify est maintenant une dépendance de notre code.

158
00:06:52,760 --> 00:06:54,151
‫Parce que sans

159
00:06:54,151 --> 00:06:56,220
‫ce package, ce morceau de

160
00:06:56,220 --> 00:06:58,261
‫code ici ne fonctionnerait plus.

161
00:06:58,261 --> 00:06:59,300
‫Droit?

162
00:06:59,300 --> 00:07:01,670
‫Notre code dépend donc

163
00:07:01,670 --> 00:07:05,630
‫maintenant de l'installation du package slugify dans le projet.

164
00:07:05,630 --> 00:07:08,000
‫Maintenant, nous pouvons aller de l'avant

165
00:07:08,000 --> 00:07:12,400
‫et stocker ces slugs ici dans le json de données, puis

166
00:07:12,400 --> 00:07:13,610
‫créer l'application

167
00:07:13,610 --> 00:07:15,630
‫de sorte qu'au lieu

168
00:07:15,630 --> 00:07:19,060
‫de l'ID, elle affiche le slug dans l'URL.

169
00:07:19,060 --> 00:07:20,480
‫Mais je ne vais

170
00:07:20,480 --> 00:07:22,350
‫pas continuer et faire ça ici parce

171
00:07:22,350 --> 00:07:24,180
‫que c'est juste en utilisant les

172
00:07:24,180 --> 00:07:26,230
‫mêmes concepts que nous avons appris auparavant.

173
00:07:26,230 --> 00:07:29,260
‫Et donc ça n'apporte rien de nouveau.

174
00:07:29,260 --> 00:07:30,840
‫Tout ce que je

175
00:07:30,840 --> 00:07:33,500
‫voulais faire dans cette vidéo est vraiment de vous

176
00:07:33,500 --> 00:07:36,610
‫montrer ce processus d'intégration d'un nouveau package dans notre code.

177
00:07:36,610 --> 00:07:38,640
‫Jetez un œil à la

178
00:07:38,640 --> 00:07:40,171
‫documentation, puis faites

179
00:07:40,171 --> 00:07:43,090
‫un exemple simple avec ce nouveau module.

180
00:07:43,090 --> 00:07:44,660
‫C'était donc le but de cette vidéo.

181
00:07:44,660 --> 00:07:46,120
‫C'est terminé maintenant.

182
00:07:46,120 --> 00:07:48,240
‫Et donc passons maintenant

183
00:07:48,240 --> 00:07:49,643
‫au suivant.

