1
00:00:03,900 --> 00:00:07,540
Allons pêcher au marché du bar.

2
00:00:07,540 --> 00:00:10,520
Nous commencerons avec Firebase,

3
00:00:10,520 --> 00:00:13,560
l'offre premium de Google.

4
00:00:13,560 --> 00:00:16,190
Comprenons un peu Firebase,

5
00:00:16,190 --> 00:00:19,375
configurez un serveur Firebase,

6
00:00:19,375 --> 00:00:22,340
puis nous allons regarder l'application angulaire,

7
00:00:22,340 --> 00:00:24,790
que je vais moderniser en fonction de

8
00:00:24,790 --> 00:00:29,340
l'application angulaire précédente que vous avez vu dans la conférence précédente.

9
00:00:29,340 --> 00:00:34,890
Nous allons le modifier pour utiliser Firebase comme backend.

10
00:00:34,890 --> 00:00:38,890
Ainsi, comme nous le verrions à la fin de cette leçon, de

11
00:00:38,890 --> 00:00:41,440
cet exercice et de l'exercice suivant,

12
00:00:41,440 --> 00:00:46,600
nous pouvons facilement prendre une application angulaire et la moderniser pour utiliser

13
00:00:46,600 --> 00:00:52,245
Firebase en tant que fournisseur de services.

14
00:00:52,245 --> 00:00:54,612
Pour commencer le voyage,

15
00:00:54,612 --> 00:01:00,725
allons sur firebase.google.com pour comprendre un peu plus à propos de Firebase.

16
00:01:00,725 --> 00:01:04,635
Une sorte de sujet de faire une présentation complète sur Firebase,

17
00:01:04,635 --> 00:01:06,550
je vais rapidement vous faire parcourir ce qui a été

18
00:01:06,550 --> 00:01:09,370
expliqué sur le site Firebase lui-même parce qu'ils vous donnent

19
00:01:09,370 --> 00:01:15,125
suffisamment de détails sur la façon dont Firebase elle-même prend en charge diverses fonctionnalités.

20
00:01:15,125 --> 00:01:19,810
Nous allons donc parcourir ce site Web pour comprendre comment Firebase fonctionne.

21
00:01:19,810 --> 00:01:22,480
Donc, si vous allez sur le site Web, comme vous pouvez

22
00:01:22,480 --> 00:01:27,955
le voir, Firebase vous aide à créer de meilleures applications mobiles et à développer votre entreprise.

23
00:01:27,955 --> 00:01:30,750
Et puis, comme vous

24
00:01:30,750 --> 00:01:36,280
le voyez ici, il vous explique comment il vous permet de créer

25
00:01:36,280 --> 00:01:41,641
rapidement vos applications sans avoir à gérer l'infrastructure back-end de votre application,

26
00:01:41,641 --> 00:01:46,875
et une console unique qui réunit un tas de produits qui fonctionnent ensemble.

27
00:01:46,875 --> 00:01:56,305
Donc, ce sont tous des produits proposés par Google qui fonctionnent ensemble pour répondre à vos besoins back-end.

28
00:01:56,305 --> 00:02:00,010
Et ici aussi, vous pouvez tirer parti

29
00:02:00,010 --> 00:02:03,585
de nombreux produits complémentaires disponibles auprès de Google.

30
00:02:03,585 --> 00:02:06,055
Ainsi, en particulier, dans cet exercice,

31
00:02:06,055 --> 00:02:09,620
nous allons tirer parti du Cloud Firestore,

32
00:02:09,620 --> 00:02:12,775
la nouvelle disposition de Google.

33
00:02:12,775 --> 00:02:15,740
Nous verrons plus de détails à ce sujet plus tard.

34
00:02:15,740 --> 00:02:18,520
Nous examinons comment nous pouvons utiliser la prise en charge

35
00:02:18,520 --> 00:02:22,030
de l'authentification fournie par Firebase pour l'authentification des utilisateurs.

36
00:02:22,030 --> 00:02:27,880
Nous examinerons le stockage dans le cloud pour stocker nos fichiers image et les servir.

37
00:02:27,880 --> 00:02:34,650
Et puis nous allons également voir comment nous pouvons tirer parti de tous ces éléments avec

38
00:02:34,650 --> 00:02:41,170
le module de noeud lié à FireBase que nous pouvons intégrer avec le

39
00:02:41,170 --> 00:02:46,270
module de noeud angularfire2 dans notre application angulaire afin que

40
00:02:46,270 --> 00:02:51,910
nous puissions communiquer avec notre backend Firebase en tant que service.

41
00:02:51,910 --> 00:02:55,300
En outre, en regardant plus de détails,

42
00:02:55,300 --> 00:02:58,390
nous voyons comment le tableau de

43
00:02:58,390 --> 00:03:04,525
bord Firebase lui-même fournit diverses fonctionnalités comme vous permettre de déployer

44
00:03:04,525 --> 00:03:11,200
différentes fonctionnalités utilisateur pour différentes intégration de votre application et

45
00:03:11,200 --> 00:03:17,590
comment il est facile d'intégrer votre backend avec un iOS,

46
00:03:17,590 --> 00:03:20,110
Android ou l'application Web .

47
00:03:20,110 --> 00:03:26,305
En particulier, nous allons examiner l'application web et l'utilisation de JavaScript

48
00:03:26,305 --> 00:03:29,290
ainsi que l'utilisation de la façon dont nous allons l'

49
00:03:29,290 --> 00:03:33,610
intégrer dans notre application angulaire un peu plus tard.

50
00:03:33,610 --> 00:03:39,900
De plus, Firebase fournit une base de données en temps réel, à

51
00:03:39,900 --> 00:03:42,850
la fois la base de données en temps réel originale,

52
00:03:42,850 --> 00:03:45,040
ainsi que le nouveau Cloud Firestone,

53
00:03:45,040 --> 00:03:50,905
vous permettent de synchroniser automatiquement les données entre les différents appareils utilisateur.

54
00:03:50,905 --> 00:03:52,900
Ainsi, toutes

55
00:03:52,900 --> 00:03:59,625
les modifications apportées côté serveur seront automatiquement répercutées sur tous les clients,

56
00:03:59,625 --> 00:04:06,996
et, bien sûr, vous pouvez lire plus de détails sur Firebase sur ce site.

57
00:04:06,996 --> 00:04:13,885
Et c'est très facile de commencer car l'offre de base est gratuite pour les utilisateurs.

58
00:04:13,885 --> 00:04:17,854
Commençons donc à utiliser Firebase.

59
00:04:17,854 --> 00:04:25,085
Nous allons configurer notre compte Firebase, puis accéder et configurer notre backend en tant que serveur,

60
00:04:25,085 --> 00:04:29,025
que nous allons ensuite tirer parti de notre application angulaire.

61
00:04:29,025 --> 00:04:31,995
Donc, c'est une visite rapide de Firebase,

62
00:04:31,995 --> 00:04:34,880
mais au lieu de simplement les regarder,

63
00:04:34,880 --> 00:04:38,665
allons nous salir les mains, en

64
00:04:38,665 --> 00:04:41,970
configurant une base Firebase

65
00:04:41,970 --> 00:04:45,900
dans le service, puis en l'utilisant sur notre application angulaire.

66
00:04:45,900 --> 00:04:47,593
Donc, pour commencer,

67
00:04:47,593 --> 00:04:49,910
comme vous le verrez sur le bord droit ici,

68
00:04:49,910 --> 00:04:51,510
il dit aller à la console.

69
00:04:51,510 --> 00:04:56,705
Évidemment, vous devriez avoir un compte Google pour pouvoir utiliser Firebase.

70
00:04:56,705 --> 00:04:58,264
Cela va sans dire,

71
00:04:58,264 --> 00:05:00,380
et vous devriez être connecté à votre compte Google.

72
00:05:00,380 --> 00:05:01,640
Donc, comme vous pouvez le voir,

73
00:05:01,640 --> 00:05:03,225
je suis déjà dans mon compte Google.

74
00:05:03,225 --> 00:05:05,080
Ça me donnera accès à ma console.

75
00:05:05,080 --> 00:05:06,857
Si vous n'êtes pas connecté,

76
00:05:06,857 --> 00:05:09,871
il est préférable de vous connecter à votre compte Google.

77
00:05:09,871 --> 00:05:12,150
Ainsi, lorsque vous accédez à la console,

78
00:05:12,150 --> 00:05:18,620
vous accédez à la console des services Firebase ici,

79
00:05:18,620 --> 00:05:22,335
où vous pouvez configurer des projets.

80
00:05:22,335 --> 00:05:23,825
Donc, lorsque vous allez à la console,

81
00:05:23,825 --> 00:05:26,460
comme vous pouvez le voir, il est dit ajouter un projet.

82
00:05:26,460 --> 00:05:27,605
Et, comme vous pouvez le voir,

83
00:05:27,605 --> 00:05:30,675
j'ai déjà essayé de mettre en place

84
00:05:30,675 --> 00:05:35,750
un autre projet Firebase avant de vous l'expliquer.

85
00:05:35,750 --> 00:05:38,190
Alors mettons en place un projet ici.

86
00:05:38,190 --> 00:05:41,065
Donc, nous allons cliquer sur le projet ajouter,

87
00:05:41,065 --> 00:05:46,865
et cela devrait faire apparaître une belle petite fenêtre,

88
00:05:46,865 --> 00:05:48,765
où vous pouvez taper des informations.

89
00:05:48,765 --> 00:05:53,750
Donc, nous allons appeler ce projet comme ConfusionServer,

90
00:05:53,750 --> 00:06:00,793
comme vous le souhaitez et le configurer où que vous soyez en ce moment.

91
00:06:00,793 --> 00:06:06,615
Je vais donc le configurer pour utiliser

92
00:06:06,615 --> 00:06:15,194
Hong Kong et créer un projet.

93
00:06:15,194 --> 00:06:17,850
Et une fois votre projet créé,

94
00:06:17,850 --> 00:06:21,575
c'est ce qui vous sera présenté par Firebase.

95
00:06:21,575 --> 00:06:28,980
Et, ici, vous verrez que la première chose que vous voudriez saisir

96
00:06:28,980 --> 00:06:32,430
est des informations sur votre configuration Firebase afin

97
00:06:32,430 --> 00:06:36,670
que vous puissiez l'utiliser dans votre application angulaire.

98
00:06:36,670 --> 00:06:37,950
Pour ce faire,

99
00:06:37,950 --> 00:06:40,985
cliquez sur ce bouton ici.

100
00:06:40,985 --> 00:06:44,085
Donc, il est dit, ajoutez Firebase à votre application web.

101
00:06:44,085 --> 00:06:47,730
Et cela vous fournira un tas d'informations que

102
00:06:47,730 --> 00:06:51,750
vous devriez copier et enregistrer car je vais

103
00:06:51,750 --> 00:06:54,585
utiliser ces informations pour configurer

104
00:06:54,585 --> 00:07:00,045
mon application angulaire un peu plus tard dans le prochain exercice.

105
00:07:00,045 --> 00:07:04,440
Enregistrez donc ces informations à un emplacement approprié afin que vous

106
00:07:04,440 --> 00:07:10,350
puissiez utiliser ces informations lorsque vous configurez le site de votre client.

107
00:07:10,350 --> 00:07:14,310
L' étape suivante, je vais mettre en place quelques comptes ici.

108
00:07:14,310 --> 00:07:17,235
Alors laissez-moi cliquer sur l'authentification ici.

109
00:07:17,235 --> 00:07:20,655
Et lorsque l'authentification sera ouverte,

110
00:07:20,655 --> 00:07:27,060
nous allons configurer les méthodes de connexion que nous allons utiliser pour notre serveur Firebase,

111
00:07:27,060 --> 00:07:29,865
et dans mon cas,

112
00:07:29,865 --> 00:07:38,520
j'utiliserai le mot de passe e-mail comme l'une des options.

113
00:07:38,520 --> 00:07:41,080
Nous allons donc activer le mot de passe e-mail.

114
00:07:41,080 --> 00:07:45,095
Je vais également activer la connexion Google.

115
00:07:45,095 --> 00:07:46,560
Donc ces deux-là sont activés.

116
00:07:46,560 --> 00:07:55,000
Si vous le souhaitez, vous pouvez activer d'autres méthodes d'authentification des utilisateurs.

117
00:07:55,000 --> 00:07:57,705
Ensuite, aller aux utilisateurs, maintenant,

118
00:07:57,705 --> 00:08:02,895
si vous vous connectez à cette application avec votre compte Google,

119
00:08:02,895 --> 00:08:07,812
cet utilisateur sera automatiquement ajouté dans votre système.

120
00:08:07,812 --> 00:08:13,610
Mais maintenant, je vais configurer un utilisateur avec un email et un mot de passe.

121
00:08:13,610 --> 00:08:21,195
Donc, je vais mettre en place un admin@confusion.net,

122
00:08:21,195 --> 00:08:31,105
et je vais mettre en place un mot de passe ici et ajouter à l'utilisateur.

123
00:08:31,105 --> 00:08:34,385
Donc, ce sera un utilisateur,

124
00:08:34,385 --> 00:08:38,630
qui peut se connecter avec la combinaison email-mot de passe.

125
00:08:38,630 --> 00:08:45,285
Nous pouvons également vous inscrire pour y accéder en utilisant notre compte Google.

126
00:08:45,285 --> 00:08:47,690
Donc, mon application angulaire,

127
00:08:47,690 --> 00:08:51,770
je vais configurer pour utiliser à la fois le moyen de mot de passe e-mail de connexion

128
00:08:51,770 --> 00:08:56,215
et ainsi que par la connexion basée sur un compte Google.

129
00:08:56,215 --> 00:09:00,700
Après cela, nous irons dans le stockage.

130
00:09:00,700 --> 00:09:03,620
Nous allons donc configurer le stockage suivant.

131
00:09:03,620 --> 00:09:09,650
Donc, le stockage est l'endroit où vous pouvez configurer un moyen

132
00:09:09,650 --> 00:09:18,035
de télécharger des fichiers sur votre serveur, puis de les rendre disponibles pour utilisation.

133
00:09:18,035 --> 00:09:22,084
Donc, ce stockage, je vais configurer mon stockage pour stocker

134
00:09:22,084 --> 00:09:28,073
les images que nous allons utiliser et enregistrer à partir de notre site serveur.

135
00:09:28,073 --> 00:09:30,025
Ainsi, lorsque vous configurez le stockage,

136
00:09:30,025 --> 00:09:33,590
il viendra avec l'ensemble des règles de sécurité,

137
00:09:33,590 --> 00:09:38,880
qui spécifient quel type d'opérations sera autorisé par l'utilisateur.

138
00:09:38,880 --> 00:09:40,400
Donc, il dit permettre lire,

139
00:09:40,400 --> 00:09:44,355
écrire : si request.auth n'est pas égal à null,

140
00:09:44,355 --> 00:09:47,650
ce qui signifie que seuls les utilisateurs qui se sont connectés

141
00:09:47,650 --> 00:09:52,377
à ce serveur seront en mesure de lire et d'écrire.

142
00:09:52,377 --> 00:09:59,270
Maintenant, je vais changer cela pour autoriser les lectures pour n'importe qui,

143
00:09:59,270 --> 00:10:06,035
mais les écritures ne seront autorisées que par les utilisateurs authentifiés.

144
00:10:06,035 --> 00:10:07,675
Donc on va dire, j'ai compris,

145
00:10:07,675 --> 00:10:12,348
et ensuite je vais commencer.

146
00:10:12,348 --> 00:10:13,845
Donc, dans les règles,

147
00:10:13,845 --> 00:10:18,705
je vais entrer dans les règles ici et ensuite modifier les règles pour

148
00:10:18,705 --> 00:10:24,845
permettre aux utilisateurs de pouvoir lire à partir du serveur.

149
00:10:24,845 --> 00:10:29,590
Maintenant, nous pouvons le configurer au niveau du dossier spécifique,

150
00:10:29,590 --> 00:10:31,620
mais comme il s'agit d'une application simple,

151
00:10:31,620 --> 00:10:36,590
je vais la configurer au niveau du stockage entier.

152
00:10:36,590 --> 00:10:39,325
Donc, ici, je vais dire, autoriser la lecture,

153
00:10:39,325 --> 00:10:43,403
et puis je vais modifier cette règle pour dire autoriser la lecture,

154
00:10:43,403 --> 00:10:48,670
et je dirai, autoriser l'écriture si demande.

155
00:10:48,670 --> 00:10:50,700
Ainsi, comme vous pouvez le voir,

156
00:10:50,700 --> 00:10:53,995
les utilisateurs seront autorisés à lire à partir du stockage.

157
00:10:53,995 --> 00:10:57,165
Tout utilisateur sera autorisé à lire, même sans authentification,

158
00:10:57,165 --> 00:11:02,750
mais l'écriture est limitée aux utilisateurs qui se connectent au système.

159
00:11:02,750 --> 00:11:06,750
Il s'agit donc d'une simple modification des règles d'accès,

160
00:11:06,750 --> 00:11:08,180
des règles de sécurité.

161
00:11:08,180 --> 00:11:10,410
Vous pouvez être plus élaboré à ce sujet,

162
00:11:10,410 --> 00:11:11,830
mais dans l'exemple simple,

163
00:11:11,830 --> 00:11:13,170
je vais rester avec cela.

164
00:11:13,170 --> 00:11:18,451
Ensuite, nous publierons ces règles sur notre serveur.

165
00:11:18,451 --> 00:11:23,600
Ensuite, revenant aux fichiers, dans les fichiers,

166
00:11:23,600 --> 00:11:30,895
je vais créer un nouveau dossier ici nommé images.

167
00:11:30,895 --> 00:11:33,760
Maintenant, comme vous le voyez,

168
00:11:33,760 --> 00:11:37,450
les règles peuvent être configurées pour ce dossier d'images spécifique, de

169
00:11:37,450 --> 00:11:42,430
sorte qu'il permettra aux utilisateurs de lire uniquement à partir de ce dossier d'images, puis seulement

170
00:11:42,430 --> 00:11:47,830
les utilisateurs autorisés à télécharger dans ce dossier d'images si vous le souhaitez.

171
00:11:47,830 --> 00:11:50,150
Mais, en ce moment, je vais le laisser en tant que tel,

172
00:11:50,150 --> 00:11:53,780
comme l'ensemble générique de règles que j'ai configuré là.

173
00:11:53,780 --> 00:11:56,705
Maintenant, allez dans le dossier des images.

174
00:11:56,705 --> 00:12:03,005
Je vais télécharger un tas d'images dans ce dossier ici.

175
00:12:03,005 --> 00:12:10,445
Alors laissez-moi prendre un tas d'images que j'ai pour mon application.

176
00:12:10,445 --> 00:12:19,915
Et donc, plus tôt, j'avais utilisé ces images dans mes autres applications.

177
00:12:19,915 --> 00:12:29,855
Je vais sélectionner toutes ces images, puis les télécharger sur le stockage Google ici.

178
00:12:29,855 --> 00:12:34,680
Ces images sont disponibles dans

179
00:12:34,680 --> 00:12:39,615
votre fichier images.zip que je vous ai fourni dans l'exercice précédent,

180
00:12:39,615 --> 00:12:41,163
dans la leçon précédente.

181
00:12:41,163 --> 00:12:43,395
Il suffit donc de télécharger le fichier images.zip,

182
00:12:43,395 --> 00:12:44,910
ou si vous avez déjà téléchargé,

183
00:12:44,910 --> 00:12:48,720
vous devriez avoir ces images avec vous afin que vous puissiez les télécharger dans le fichier.

184
00:12:48,720 --> 00:12:50,303
Lorsque vous téléchargez ces images,

185
00:12:50,303 --> 00:12:56,215
vous pouvez cliquer sur l'une de ces images et aussi remarquer que ci-dessous,

186
00:12:56,215 --> 00:12:59,135
il vous donne cet emplacement de fichier.

187
00:12:59,135 --> 00:13:05,755
Vous devez copier cette URL pour cet emplacement de fichier car lorsque nous configurons notre base de données,

188
00:13:05,755 --> 00:13:10,785
dans le champ images de nos données JSON,

189
00:13:10,785 --> 00:13:17,525
nous allons configurer chacune d'entre elles avec cette URL pour l'image correspondante.

190
00:13:17,525 --> 00:13:21,315
Ensuite, nous passerons à cette base de données.

191
00:13:21,315 --> 00:13:25,975
Dans la base de données, vous avez deux choix.

192
00:13:25,975 --> 00:13:28,970
Vous pouvez aller avec l'ancienne base de données en temps réel,

193
00:13:28,970 --> 00:13:31,375
qui est prise en charge par Google,

194
00:13:31,375 --> 00:13:37,065
et en effet la plupart des applications actuelles qui utilisent Firebase utiliseront la base de données en temps réel.

195
00:13:37,065 --> 00:13:38,820
Mais alors, dans ce cours,

196
00:13:38,820 --> 00:13:43,420
nous allons explorer la nouvelle version bêta de Firestore.

197
00:13:43,420 --> 00:13:50,450
La version bêta de Firestore fournit une base de données en temps réel beaucoup plus complète.

198
00:13:50,450 --> 00:13:55,110
Il s'agit donc de la base de données en temps réel de nouvelle génération et fournit

199
00:13:55,110 --> 00:13:59,310
des moyens beaucoup plus avancés de faire des requêtes et de mettre à

200
00:13:59,310 --> 00:14:04,320
l'échelle automatiquement leur stockage pour nous.

201
00:14:04,320 --> 00:14:07,260
Donc on va aller avec la bêta de Firestore.

202
00:14:07,260 --> 00:14:09,870
Maintenant, l'une des raisons pour moi de commencer avec

203
00:14:09,870 --> 00:14:14,340
la bêta de Firestore est simplement parce qu'elle

204
00:14:14,340 --> 00:14:23,250
nous permet de stocker les informations sous forme de documents et de collections.

205
00:14:23,250 --> 00:14:25,770
Maintenant, d'après notre expérience avec MongoDB,

206
00:14:25,770 --> 00:14:28,988
nous savons déjà comment les documents et les collections fonctionnent,

207
00:14:28,988 --> 00:14:33,630
et c'est pourquoi la bêta de Firestore est un bien meilleur choix pour nous,

208
00:14:33,630 --> 00:14:37,275
puisque nous savons déjà comment cela est configuré.

209
00:14:37,275 --> 00:14:39,900
Si vous souhaitez utiliser par défaut la base de données en temps réel standard,

210
00:14:39,900 --> 00:14:41,280
vous pouvez choisir de le faire.

211
00:14:41,280 --> 00:14:44,040
Mais la base de données en temps réel stocke toutes vos données dans

212
00:14:44,040 --> 00:14:51,272
une grande arborescence et dispose d'une capacité d'interrogation limitée.

213
00:14:51,272 --> 00:14:56,315
Donc, pour les règles de sécurité de mon Firestore,

214
00:14:56,315 --> 00:14:59,970
j'irai avec le mode test,

215
00:14:59,970 --> 00:15:05,955
où je vais juste laisser le jeu ouvert pour que les gens lisent et écrivent en ce moment.

216
00:15:05,955 --> 00:15:11,790
Et c'est correct parce que nous testons simplement la base de données, mais normalement,

217
00:15:11,790 --> 00:15:20,245
je suggère d'aller avec une façon plus configurée de travailler avec votre base de données ici.

218
00:15:20,245 --> 00:15:23,171
Nous allons donc commencer par un mode de test.

219
00:15:23,171 --> 00:15:27,165
Nous allons donc mettre en place les règles de sécurité comme celle-ci pour commencer.

220
00:15:27,165 --> 00:15:31,280
Vous pouvez opter pour une configuration d'outil de sécurité plus élaborée.

221
00:15:31,280 --> 00:15:34,710
Donc, comme vous l'avez vu avec le stockage,

222
00:15:34,710 --> 00:15:37,255
nous avions mis en place de telle sorte que les lectures soient autorisées par

223
00:15:37,255 --> 00:15:40,620
n'importe qui, mais les écritures ne sont autorisées que par les utilisateurs autorisés.

224
00:15:40,620 --> 00:15:44,790
Nous pouvons également mettre en place une fonctionnalité similaire ici.

225
00:15:44,790 --> 00:15:47,355
Donc c'est le serveur de confusion.

226
00:15:47,355 --> 00:15:49,590
Et donc, dans les règles,

227
00:15:49,590 --> 00:15:56,160
laissez-moi aller à ce stockage et ensuite copier la règle du stockage ici,

228
00:15:56,160 --> 00:16:01,020
et nous allons mettre en place le même type de restriction ici.

229
00:16:01,020 --> 00:16:04,725
Nous allons donc permettre à tout le monde de lire, mais seulement

230
00:16:04,725 --> 00:16:11,420
les utilisateurs autorisés à écrire dans la base de données.

231
00:16:11,420 --> 00:16:15,075
Donc, en revenant à la base de données, dans les règles,

232
00:16:15,075 --> 00:16:25,688
nous pouvons dire permettre lire : et puis la deuxième ligne je vais remplacer cela, en

233
00:16:25,688 --> 00:16:29,620
disant autoriser écrire si request.auth n'est pas égal à null.

234
00:16:29,620 --> 00:16:32,535
Donc, seules les personnes qui sont connectées,

235
00:16:32,535 --> 00:16:36,540
elles seront en mesure d'apporter des modifications aux données afin que nous,

236
00:16:36,540 --> 00:16:41,441
au moins, j'ai une certaine protection sur mes données.

237
00:16:41,441 --> 00:16:48,900
Maintenant, ici, nous pouvons maintenant ajouter graphiquement les données à notre application.

238
00:16:48,900 --> 00:16:54,791
Et ceci, je trouve le moyen le plus rapide d'ajouter les données.

239
00:16:54,791 --> 00:16:57,270
Si vous configurez le site client,

240
00:16:57,270 --> 00:17:00,380
vous pouvez également publier des données à partir du site client, mais, pour l'

241
00:17:00,380 --> 00:17:04,780
instant, nous allons commencer par ajouter trois collections ici.

242
00:17:04,780 --> 00:17:10,535
Donc, la première collection que j'ajouterai est la vaisselle.

243
00:17:10,535 --> 00:17:14,800
Et nous pouvons ajouter des documents à la vaisselle,

244
00:17:14,800 --> 00:17:17,400
afin que nous puissions ajouter notre premier document.

245
00:17:17,400 --> 00:17:19,405
Donc, pour ajouter un document à la vaisselle,

246
00:17:19,405 --> 00:17:23,005
rappelez-vous que je vous ai donné le fichier DB.json là-bas.

247
00:17:23,005 --> 00:17:27,085
Ainsi, vous pouvez aller avec le fichier DB.json, puis ajouter,

248
00:17:27,085 --> 00:17:31,665
étape par étape, chacun des plats que nous avons.

249
00:17:31,665 --> 00:17:36,350
Donc, ici, je vais configurer le premier plat ici.

250
00:17:36,350 --> 00:17:44,895
Donc, pour le plat, nous pouvons autoriser Firebase à attribuer automatiquement l'ID de notre document.

251
00:17:44,895 --> 00:17:48,010
Donc, je vais laisser cela attribuer automatiquement.

252
00:17:48,010 --> 00:17:52,660
Donc, nous allons ajouter le premier plat ici.

253
00:17:52,660 --> 00:18:01,200
Le nom du champ et le premier plat ici.

254
00:18:01,200 --> 00:18:03,633
Nous devons donc ajouter minutieusement,

255
00:18:03,633 --> 00:18:07,099
peu à peu, chacun des plats ici.

256
00:18:07,099 --> 00:18:09,205
Donc nous allons dire nom,

257
00:18:09,205 --> 00:18:16,327
et ensuite nous dirons catégorie, qui est secteur.

258
00:18:16,327 --> 00:18:21,935
Et puis nous allons ajouter dans l'image,

259
00:18:21,935 --> 00:18:26,450
que je vais revenir et ajouter un peu plus tard parce que j'ai besoin de copier

260
00:18:26,450 --> 00:18:32,250
l'URL de l'image de mon stockage et de l'utiliser ici.

261
00:18:32,250 --> 00:18:48,138
Ensuite, nous l'aurons étiqueté comme Hot, prix.

262
00:18:48,138 --> 00:18:51,505
Donc, nous avons la catégorie,

263
00:18:51,505 --> 00:18:55,240
le nom, la catégorie, l'image, l'étiquette, le prix

264
00:18:55,240 --> 00:19:02,310
, la description, que je vais copier et coller à partir de mon fichier DB.json.

265
00:19:02,310 --> 00:19:07,325
Et, enfin, le drapeau en vedette,

266
00:19:07,325 --> 00:19:13,587
que je vais définir comme un booléen et définir cela sur true dans ce cas.

267
00:19:13,587 --> 00:19:20,135
Ce sera donc notre premier document que nous ajouterons ici dans notre base de données.

268
00:19:20,135 --> 00:19:22,705
Donc, vous remarquerez immédiatement que,

269
00:19:22,705 --> 00:19:26,570
dans notre base de données, le premier document est ajouté.

270
00:19:26,570 --> 00:19:29,815
Nous allons donc voir les plats et le premier document,

271
00:19:29,815 --> 00:19:35,900
et vous pouvez voir les informations sur ce document configuré ici.

272
00:19:35,900 --> 00:19:38,695
Nous avons donc la catégorie, la description, la

273
00:19:38,695 --> 00:19:44,355
vedette, l'image, l'étiquette, le nom et le prix.

274
00:19:44,355 --> 00:19:49,360
Nous allons également ajouter un champ supplémentaire appelé CreateDAT,

275
00:19:49,360 --> 00:19:54,175
et ce sera un horodatage.

276
00:19:54,175 --> 00:20:00,870
Et l'horodatage serait l'horodatage d'aujourd'hui, puis je laisse là la valeur temporelle en tant que telle.

277
00:20:00,870 --> 00:20:04,772
Donc, nous pouvons également ajouter des horodatages à cela, et, aussi,

278
00:20:04,772 --> 00:20:14,855
nous allons ajouter un horodatage de plus comme UpdateDAT et avec l'horodatage ici.

279
00:20:14,855 --> 00:20:17,145
Donc nous avons deux autres horodatages ici.

280
00:20:17,145 --> 00:20:18,730
Maintenant, pour l'image,

281
00:20:18,730 --> 00:20:21,375
nous irons au stockage ici.

282
00:20:21,375 --> 00:20:25,230
Et à partir de notre stockage, dans les images,

283
00:20:25,230 --> 00:20:31,070
nous allons sélectionner le fichier image ici,

284
00:20:31,070 --> 00:20:36,790
puis aller à l'emplacement du fichier, puis copier cette URL ici.

285
00:20:36,790 --> 00:20:38,795
Donc, si nous cliquons simplement sur

286
00:20:38,795 --> 00:20:40,880
cela, cette URL sera copiée.

287
00:20:40,880 --> 00:20:42,050
Donc, nous allons revenir à

288
00:20:42,050 --> 00:20:49,715
cette base de données, puis

289
00:20:49,715 --> 00:20:53,975
éditer le champ d'image, puis ajouter cette URL là.

290
00:20:53,975 --> 00:20:58,085
Comme ça, vous pouvez aller de l'avant et ajouter les plats restants,

291
00:20:58,085 --> 00:21:02,120
les promotions et aussi les leaders.

292
00:21:02,120 --> 00:21:04,280
Donc, une fois que vous avez terminé toutes les étapes,

293
00:21:04,280 --> 00:21:08,700
ce qui prendra un certain temps pour vous de faire étape par étape.

294
00:21:08,700 --> 00:21:13,620
Donc je vous ai laissé finir d'ajouter toutes ces informations à votre Firebase.

295
00:21:13,620 --> 00:21:18,045
Donc, une fois que vous avez terminé d'entrer toutes les données dans votre base de données,

296
00:21:18,045 --> 00:21:21,675
vos plats devraient avoir quatre plats ici.

297
00:21:21,675 --> 00:21:26,660
Encore une fois, assurez-vous d'initialiser

298
00:21:26,660 --> 00:21:33,166
le champ d'image avec l'URL de ce stockage pour cette image particulière.

299
00:21:33,166 --> 00:21:40,565
Donc vous aurez un, deux, trois et quatre plats.

300
00:21:40,565 --> 00:21:43,805
Ensuite, vous aurez quatre leaders en conséquence.

301
00:21:43,805 --> 00:21:50,860
Un, deux, trois et quatre et une promotion est là.

302
00:21:50,860 --> 00:21:54,590
Encore une fois, assurez-vous d'initialiser les images pour chacune d'

303
00:21:54,590 --> 00:21:58,940
elles de manière appropriée à partir du stockage Firebase.

304
00:21:58,940 --> 00:22:02,375
Avec cela, notre serveur est complètement configuré.

305
00:22:02,375 --> 00:22:10,100
Notre serveur Firebase dispose donc de toutes les données nécessaires pour qu'il soit conforme à nos plans.

306
00:22:10,100 --> 00:22:13,595
Nous allons maintenant passer à l'exercice suivant,

307
00:22:13,595 --> 00:22:18,725
où nous allons configurer notre client angulaire pour pouvoir accéder à

308
00:22:18,725 --> 00:22:22,370
ce backend Firebase en tant que service, puis récupérer

309
00:22:22,370 --> 00:22:26,469
des données et ensuite envoyer des données à leur serveur Firebase.

310
00:22:26,469 --> 00:22:29,440
Avec cela, nous terminons cet exercice.

311
00:22:29,440 --> 00:22:33,110
Dans cet exercice, nous avons vu à quel point il est facile pour nous de

312
00:22:33,110 --> 00:22:37,100
configurer notre backend Firebase en tant que service pour l'authentification,

313
00:22:37,100 --> 00:22:43,520
pour stocker des fichiers et les servir et aussi pour stocker des informations dans

314
00:22:43,520 --> 00:22:51,410
la base de données Cloud Firestore sous forme de collections et de documents dans les collections.

315
00:22:51,410 --> 00:22:55,180
Avec cela, nous terminons cet exercice.