1
00:00:00,150 --> 00:00:01,250
Nous saluons le retour.

2
00:00:01,290 --> 00:00:11,850
Donc, cette vidéo est une suite de la dernière vidéo où nous avons fait un aperçu conceptuel de cette application de démon chien et nous avons parlé des itinéraires de demande TO GET.

3
00:00:12,180 --> 00:00:15,110
Encore une fois, pour réitérer la même attente pour appliquer.

4
00:00:15,360 --> 00:00:32,580
Vous n'avez pas besoin de comprendre 99 pour cent de ce code si vous pouvez simplement traiter les choses comme des blocs conceptuels et vous pouvez comprendre que ce code ici est responsable de la route chiens obtenir et il en quelque sorte vous renvoie une page qui a un tas de chiens sur il.

5
00:00:32,700 --> 00:00:34,660
C'est tout ce que vous devez savoir pour l'instant.

6
00:00:34,680 --> 00:00:36,720
Il en va de même pour les nouveaux concepts.

7
00:00:36,720 --> 00:00:38,350
Nous allons apprendre dans cette vidéo.

8
00:00:38,370 --> 00:00:41,100
L'accent n'est pas syntaxique c'est sur les concepts.

9
00:00:41,430 --> 00:00:49,450
Il y a donc un troisième itinéraire ici que je n'ai pas mentionné dans la première vidéo et il est légèrement différent en ce sens qu'il s'agit d'un itinéraire post.

10
00:00:49,710 --> 00:00:57,300
Donc, ce code ici ne sera exécuté que lorsqu'un utilisateur effectue une requête POST pour slash create dog.

11
00:00:58,190 --> 00:01:04,140
Et juste pour rafraîchir votre mémoire un utilisateur ne peut pas faire une requête POST en tapant quelque chose dans le vous ou Albar.

12
00:01:04,290 --> 00:01:10,060
Neuf neuf neuf neuf neuf pour cent du temps qu'ils vont faire une requête POST est à travers un formulaire.

13
00:01:10,290 --> 00:01:12,970
Donc, nous allons voir cela en action dans un petit peu.

14
00:01:13,170 --> 00:01:16,880
Mais je peux aussi démontrer faire une demande POST par le facteur.

15
00:01:17,370 --> 00:01:20,190
Donc post demandes de barre oblique créer un chien.

16
00:01:20,370 --> 00:01:33,280
Et ce qu'il fera, c'est qu'il faudra le nom dans la race que nous envoyons dans la demande qui est ce qui se passe ici le nom est la demande jusqu'à la requête de la race de nom du corps jusqu'à corps outbreed.

17
00:01:33,300 --> 00:01:41,020
Donc, dans la demande il ya un nom et une race dans cette chose appelée le corps et nous utilisons cela pour faire un nouveau chien.

18
00:01:41,370 --> 00:01:50,850
Et puis nous redirigons l'utilisateur vers les chiens de boue comme une demande d'obtenir qui va ensuite exécuter tout ce code que vous trouverez tous les chiens et rendre la page des chiens.

19
00:01:51,120 --> 00:01:52,560
Donc beaucoup de choses se passent.

20
00:01:52,830 --> 00:01:58,910
Commençons par le tout début en envoyant une simple demande de post pour creer un chien.

21
00:01:59,250 --> 00:02:14,230
Donc, allons au facteur et je vais changer cela sur le poste et puis nous avons besoin de changer l'itinéraire pour être localhost 3000 slash créer un chien et nous devons nous assurer que le serveur est toujours OK quand il est.

22
00:02:14,730 --> 00:02:22,090
Et puis nous pouvons commencer en frappant envoyer où nous n'allons pas envoyer un nom et une lecture et nous allons voir ce qui se passe.

23
00:02:23,550 --> 00:02:31,010
Donc, si vous regardez ce que nous avons récupéré, c'est la même page chiens où a Rustie pourquoi il Daisy Sitka.

24
00:02:31,200 --> 00:02:35,250
Et puis il ya aussi un chien vide sans nom et sans race.

25
00:02:35,310 --> 00:02:46,800
Et si je vais à mon navigateur ici et je rafraîchis je fais une autre demande de slash de chiens qui déclenchera le code qui récupère tous les chiens de la base de données et rend un peu en direct pour chacun d'eux.

26
00:02:46,950 --> 00:02:53,120
Vous pouvez voir en fait que nous avons un chien vide dans la base de données et c'est parce que nous n'avons pas envoyé de données.

27
00:02:53,130 --> 00:02:56,630
Nous n'avons pas envoyé un nom et une race pour faire notre nouveau chien avec.

28
00:02:56,670 --> 00:03:01,300
Donc, ils étaient vides et notre code vient de faire un chien vide et enregistré dans la base de données.

29
00:03:01,500 --> 00:03:09,870
Donc, pour envoyer les données avec le facteur, nous pouvons aller au corps et puis nous pouvons simplement taper quelques choses à ajouter au corps.

30
00:03:10,080 --> 00:03:19,900
Donc nous voulons un nom pour être Charlie et lire et la valeur de Breede sera laboratoire juste comme ça.

31
00:03:19,920 --> 00:03:26,430
C'est tout ce que nous devons faire par le biais du facteur pour faire une demande de post qui a le nom et la race à l'intérieur de son corps.

32
00:03:26,760 --> 00:03:28,210
Et je vais envoyer.

33
00:03:28,770 --> 00:03:30,630
Maintenant, vous verrez la réponse que nous recevons.

34
00:03:30,660 --> 00:03:34,150
C'est tous les chiens à nouveau cette fois à la fin.

35
00:03:34,170 --> 00:03:36,090
Nous avons Charlie comme laboratoire.

36
00:03:36,270 --> 00:03:41,400
Et si je me rafraîchir ici faire une autre demande, je reçois tous les chiens.

37
00:03:41,700 --> 00:03:43,100
Charlie a été ajouté.

38
00:03:43,530 --> 00:03:46,090
Reprenons tout cela en 30 secondes ici.

39
00:03:46,290 --> 00:03:51,310
Donc je fais une demande une demande de poste pour créer un chien juste un autre type de demande.

40
00:03:51,540 --> 00:03:57,450
Et dans la demande du corps qui est ici, je suis en ajoutant le nom et la race de Charlie et de laboratoire.

41
00:03:57,840 --> 00:04:05,040
Et puis j'ai frappé envoyer et puis dans mon code sur le serveur est à l'écoute pour une demande de poste à slash chien.

42
00:04:05,510 --> 00:04:13,730
Et il crée un chien avec la demande que quelqu'un ne nomme pas et demande à quelqu'un d'outbreed qui sont ces deux choses que nous avons envoyé avec le facteur.

43
00:04:14,220 --> 00:04:22,310
Et puis après qu'il crée le chien, il nous redirige vers les chiens de chasse afin qu'il ne nous envoie pas une page ou de tout âge pour lui.

44
00:04:22,470 --> 00:04:31,260
Il fonctionne en fait le code dans les chiens slash ici qui trouve alors tous les chiens, y compris la nouvelle marque que nous venons de créer.

45
00:04:31,380 --> 00:04:35,870
Charlie ou dans le cas précédent c'était un chien vide sans nom ni race.

46
00:04:36,000 --> 00:04:40,500
Il récupère tous et ensuite il rend le modèle de ce chien que nous avons vu.

47
00:04:40,680 --> 00:04:43,740
Et pour chacun, il nous fait peu d'alliés.

48
00:04:44,640 --> 00:04:46,330
Donc beaucoup de choses se passent.

49
00:04:46,440 --> 00:04:48,060
Il écoute une demande POST.

50
00:04:48,270 --> 00:04:52,650
C'est ajouter un nouveau chien à une base de données et il nous redirige vers les chiens de chasse.

51
00:04:52,650 --> 00:04:56,170
Maintenant, nous allons parler de la façon dont nous pourrions faire cela avec un formulaire.

52
00:04:56,220 --> 00:05:01,920
N'oubliez pas que nous ne pouvons pas faire une requête POST en tapant dans la barre, mais nous pouvons en faire une en utilisant un formulaire.

53
00:05:02,010 --> 00:05:05,630
Donc, je vais ajouter un formulaire juste à mes chiens.

54
00:05:05,770 --> 00:05:06,240
Oui.

55
00:05:06,290 --> 00:05:07,330
Tout au fond.

56
00:05:07,410 --> 00:05:19,730
Juste aller faire une étiquette de formulaire et il ya deux parties à une forme qui aura maintenant plus de sens nous en avons parlé quand je présente des formes à l'origine, mais vous n'avez pas beaucoup de contexte pour comprendre ce qu'ils voulaient dire.

57
00:05:19,750 --> 00:05:24,170
Ces deux attributs sont donc l'action et la méthode.

58
00:05:24,520 --> 00:05:26,150
Donc, je vais commencer par la méthode.

59
00:05:26,230 --> 00:05:30,780
Nous faisons une demande post et vous le voyez souvent dans tous les casquettes aussi.

60
00:05:30,790 --> 00:05:31,750
Peu importe.

61
00:05:31,990 --> 00:05:38,870
Et puis l'action est où nous faisons une demande de poste qui est juste barre oblique créer un chien.

62
00:05:39,120 --> 00:05:46,130
Donc, chaque fois que ce formulaire est soumis, il enverra une demande de poste pour créer un chien qui est ce que nous attendons ici.

63
00:05:46,150 --> 00:05:50,080
POST request create dog exécutera ce code.

64
00:05:50,290 --> 00:05:52,210
Ensuite, nous devons ajouter nos intrants.

65
00:05:52,270 --> 00:05:54,020
Nous allons donc avoir deux commentaires.

66
00:05:54,190 --> 00:06:02,360
Type est égal au texte sur les deux comme ça et le détenteur de place pour celui-ci qui dit simplement nom.

67
00:06:02,500 --> 00:06:05,270
Et puis le prochain sera pour la race.

68
00:06:05,860 --> 00:06:20,520
Et la dernière chose que nous allons faire est d'avoir un type d'entrée appelé submit qui sera notre bouton et si nous rafraîchissons la page, nous avons maintenant un formulaire, mais il ya un problème.

69
00:06:20,590 --> 00:06:21,620
Si je le remplis.

70
00:06:21,730 --> 00:06:32,870
Donc, nous ajoutons un autre chien ici Skittles qui peut être un caniche quand je frappe envoyer, il enverra une demande de post pour slash créer un chien.

71
00:06:33,190 --> 00:06:37,450
Mais regardez quand je fais que nous nous retrouvons avec un chien vide.

72
00:06:37,810 --> 00:06:44,940
Et c'est parce que même si j'ai deux entrées je n'ai pas dit au navigateur ce que le nom de ces entrées sont.

73
00:06:45,400 --> 00:06:56,870
Et celui-ci doit être appelé nom qui est un nom peu confus parce que le nom et celui-ci doit être la race et fait donc un placeholder.

74
00:06:56,880 --> 00:07:08,600
Donc maintenant ce que nous avons fait est en ajoutant cet attribut de nom que nous avons dit au navigateur lorsque l'utilisateur a soumis ce formulaire envoyer une demande de poste pour créer un chien avec deux morceaux de données.

75
00:07:08,920 --> 00:07:15,430
Nom doit être égal à ce qui est dans cette entrée et la race est égale à ce qui est dans cette entrée ainsi.

76
00:07:15,490 --> 00:07:19,040
Nous allons dépenser des tonnes de temps à écrire des formulaires et de traiter avec les différents attributs.

77
00:07:19,240 --> 00:07:20,760
Donc ne soyez pas trop pris dans ce.

78
00:07:20,920 --> 00:07:24,810
Mais ce qui est important maintenant, c'est que nous ajoutons des données au corps.

79
00:07:24,820 --> 00:07:39,260
Et si je rafraîchis et ajoutez dans Skittles qui est un caniche et maintenant j'avais soumis, vous pouvez voir qu'il a envoyé une demande de poste et vous pouvez le voir ici post pour slash créer un chien.

80
00:07:39,880 --> 00:07:48,370
Et puis ce qui s'est passé est au lieu de créer ce chien ici, il a créé un chien avec les données de la forme le nom et la race.

81
00:07:48,820 --> 00:07:54,060
Et puis après qu'il a créé ce chien et enregistré la base de données ne compte pas vraiment comment cela fonctionne.

82
00:07:54,070 --> 00:07:56,460
Mais ça marche.

83
00:07:56,470 --> 00:08:08,370
Puis nous redirigons vers les chiens slash qui est pourquoi il ya effectivement une deuxième chose peu imprimé ici qui dit une demande d'obtenir a été faite de chiens de chasse même si je n'ai pas réellement frappé entrer.

84
00:08:08,380 --> 00:08:17,190
Ce qui s'est passé, c'est quand j'ai fait une demande de slash créer un chien comme un post à la fin de celui-ci, il fait réellement une autre demande pour moi de chiens de chiens.

85
00:08:17,440 --> 00:08:26,750
Et puis qui trouve tous les chiens et puis il rend le modèle de chiens que nous voyons ici et puis nous obtenons la forme au fond et tout le chien se trouve.

86
00:08:26,830 --> 00:08:28,830
Et c'est pourquoi nous voyons cela ici.

87
00:08:28,890 --> 00:08:42,530
Donc, si vous payez vraiment l'attention à cette icône ici, vous verrez effectivement tellement à un autre chien nommé Snicker de garder avec le thème des bonbons et snickers peut être un laboratoire ainsi.

88
00:08:42,750 --> 00:08:44,230
Quand je clique sur soumettre.

89
00:08:44,230 --> 00:08:46,180
Regardez cela très attentivement.

90
00:08:46,170 --> 00:08:47,390
Ça va être très rapide.

91
00:08:47,800 --> 00:08:49,900
Mais il a changé pour juste un instant.

92
00:08:50,200 --> 00:09:08,980
Et c'est important parce que cela montre que quand je fais une demande, ça me retire vraiment de cette page et nous sommes redirigés ici juste très vite, donc nous ne resterons pas sur cette page tout le temps qu'il nous emmène Pour un instant, puis nous redirige et nous montre ce contenu et c'est ce qui se passe ici.

93
00:09:08,980 --> 00:09:14,000
Lorsque vous faites une demande de barre oblique créer un chien, il nous redirige vers les chiens de chasse.

94
00:09:14,160 --> 00:09:20,350
Et puis à l'intérieur des chiens, il nous rend le modèle du chien qui est la façon dont nous voyons tout cela dans le navigateur.

95
00:09:20,670 --> 00:09:20,930
D'ACCORD.

96
00:09:20,950 --> 00:09:22,350
Nous avons donc beaucoup couvert.

97
00:09:22,360 --> 00:09:24,850
Permettez-moi seulement de souligner les parties importantes.

98
00:09:24,850 --> 00:09:42,250
L'un est que l'intérieur de notre code serveur, nous pouvons distinguer entre une demande d'obtenir et une demande de poste et nous pouvons faire du code différent en fonction de ce qui s'est passé quand et n'oubliez pas un get est de récupérer des informations et un post est d'ajouter ou de soumettre des informations qui est quoi Nous utilisons pour.

99
00:09:42,390 --> 00:09:46,010
Slash créer un chien comme un post est la façon dont vous pouvez créer un nouveau chien.

100
00:09:46,240 --> 00:09:50,860
Et il ya deux choses qui doivent être dans le corps de la demande le nom et la race.

101
00:09:50,980 --> 00:09:53,710
Et s'ils ne sont pas là, il fera un chien vide.

102
00:09:54,000 --> 00:10:00,100
Mais quel que soit le type de chien il le fait alors nous redirige vers les chiens de chasse qui exécute alors tout ce code.

103
00:10:00,550 --> 00:10:05,680
Et l'autre chose importante, c'est que lorsque nous présentons cela il ya un rafraîchissement instantané.

104
00:10:05,670 --> 00:10:10,890
C'est vraiment très rapide, mais c'est toujours un rafraîchissement où nous faisons une demande ailleurs.

105
00:10:11,020 --> 00:10:15,250
Juste comme si j'ai fait ceci et j'ai frappé Enter nous sommes réellement faire une autre demande.

106
00:10:15,280 --> 00:10:16,500
Même idée ici.

107
00:10:16,680 --> 00:10:17,880
Quand je clique sur soumettre.

108
00:10:18,100 --> 00:10:21,060
Continuez à regarder ici fait une demande à chaque fois.

109
00:10:21,310 --> 00:10:28,440
Donc c'est tout ce que je veux parler autour de cette introduction deux serveurs et deux itinéraires et HTP.

110
00:10:28,620 --> 00:10:29,890
Nous avons terminé pour le moment.

111
00:10:29,880 --> 00:10:38,230
Nous allons donc mettre l'accent sur la mise en place de notre environnement de développement et l'installation de tous les outils dont vous avez besoin afin que nous puissions commencer à écrire un code comme celui-ci.