1
00:00:00,210 --> 00:00:01,510
Bon retour.

2
00:00:01,530 --> 00:00:04,700
C'est donc l'une des leçons les plus importantes de tout le cours.

3
00:00:04,890 --> 00:00:08,670
Mais ça va aussi être très différent de ce que nous avons fait jusqu'ici.

4
00:00:08,670 --> 00:00:18,120
Et la raison pour laquelle il est différent, c'est que je vais vous montrer un tas de code que vous n'avez jamais vu auparavant et vous ne sont pas censés comprendre du tout.

5
00:00:18,120 --> 00:00:23,770
La raison pour laquelle je fais ceci est que je veux vous donner un aperçu conceptuel de la façon dont toutes ces pièces s'emboîtent.

6
00:00:23,790 --> 00:00:28,430
La base de données que le serveur GET demander demande demande le navigateur.

7
00:00:28,440 --> 00:00:30,900
Toutes ces demandes et réponses différentes choses.

8
00:00:31,080 --> 00:00:35,430
Je veux montrer tout cela avec une application de travail vraiment simple.

9
00:00:35,430 --> 00:00:37,120
C'est ce que je vais faire ici.

10
00:00:37,200 --> 00:00:43,920
Si je l'enseignais en personne ce serait le point où je vous demande de mettre votre ordinateur portable pour fermer votre ordinateur.

11
00:00:44,040 --> 00:00:45,670
Évidemment pas une bonne idée ici.

12
00:00:45,930 --> 00:00:50,100
Mais le sentiment derrière cela, c'est que je ne veux pas que vous preniez des notes à ce sujet.

13
00:00:50,100 --> 00:00:57,240
Nous allons passer en revue chaque ligne et l'écrire à partir de zéro et faire cinq six sept de ces différentes applications en utilisant ces concepts.

14
00:00:57,240 --> 00:01:03,580
Donc, il s'agit juste de savoir comment les choses ne coïncident pas les détails réels de la façon dont ils fonctionnent.

15
00:01:03,600 --> 00:01:06,630
Cela dit, allons-y et commencez ici.

16
00:01:07,020 --> 00:01:09,840
Donc, cette application est axée sur les chiens.

17
00:01:09,840 --> 00:01:11,010
C'est très simple.

18
00:01:11,010 --> 00:01:12,320
Aucun style du tout.

19
00:01:12,420 --> 00:01:14,320
Juste quelques pages différentes.

20
00:01:14,430 --> 00:01:19,250
Et la première chose dont nous avons besoin de parler est ce que ce fichier est entier.

21
00:01:19,260 --> 00:01:21,750
Donc c'est notre fichier serveur.

22
00:01:21,750 --> 00:01:23,450
Dans mon cas, il s'appelle app dodge.

23
00:01:23,460 --> 00:01:25,720
Oui, cela est écrit en Javascript.

24
00:01:25,800 --> 00:01:30,180
Et quand je lance ce fichier, il va effectivement démarrer un serveur pour moi.

25
00:01:30,180 --> 00:01:41,310
Donc, quand je l'ai mentionné avant quand nous envoyons une demande pour le lire dot com slash recherche il ya du code sur le serveur Reddit qui est à l'écoute d'une demande de le lire.

26
00:01:41,310 --> 00:01:45,850
Maintenant, com slash search et puis il vous renvoie les données correctes dans une réponse.

27
00:01:46,080 --> 00:01:50,990
Quand je dis qu'il ya du code sur le serveur Reddit c'est le genre de code dont nous parlons.

28
00:01:51,210 --> 00:02:00,620
Donc, même si la lecture est faite en Python et c'est javascript C'est notre code sur le serveur qui est à l'écoute pour différentes demandes et puis de répondre avec des morceaux différents.

29
00:02:00,630 --> 00:02:05,150
Il ya trois grands morceaux et ce haut de la page vient d'obtenir notre application mis en place.

30
00:02:05,250 --> 00:02:09,370
Ainsi, y compris les bibliothèques de droite comme vous pouvez le voir il ya quelques dépendances.

31
00:02:09,390 --> 00:02:11,560
Encore une fois, nous les examinerons plus tard.

32
00:02:11,850 --> 00:02:13,570
Alors nous avons quelques trucs de base de données.

33
00:02:13,830 --> 00:02:22,060
Donc, c'est la mise en place de notre base de données afin que notre base de données connaît chaque chien a un nom et une race et ils sont les deux chaînes.

34
00:02:22,470 --> 00:02:24,240
Et tout cela est mentionné à ce sujet pour l'instant.

35
00:02:24,630 --> 00:02:39,040
Et puis il ya ces choses appelées wraps qui est où nous allons passer la majeure partie de notre temps dans cette leçon avant que nous faisons que si je veux souligner la partie la plus importante pour démarrer réellement le serveur qui est à la fin ici ce Ligne n'a pas d'importance la syntaxe, mais ce qui importe.

36
00:02:39,050 --> 00:02:40,930
Il y a ici trois mille.

37
00:02:40,950 --> 00:02:51,860
Ce que cela va faire, c'est quand nous exécutons cette application quand je lance ce fichier dans mon terminal, il va effectivement démarrer au serveur et notre application sera sur le port 3000.

38
00:02:51,870 --> 00:02:53,160
Alors laissez-moi vous montrer ce que je veux dire.

39
00:02:53,160 --> 00:02:59,130
Je vais démarrer ce serveur en exécutant le fichier à nouveau peu importe ce que je fais là.

40
00:02:59,130 --> 00:03:03,260
Et vous pouvez voir que je reçois un message de service de démo sur le port 3000.

41
00:03:03,570 --> 00:03:07,650
Donc ce que j'ai mon éditeur de texte, j'écris le code ici pour mon serveur.

42
00:03:07,860 --> 00:03:11,000
Ensuite, dans mon terminal, je suis effectivement en cours d'exécution du serveur.

43
00:03:11,220 --> 00:03:18,840
Donc maintenant ce code est en cours d'exécution tout ce code est exécuté et cette ligne en particulier a démarré un serveur sur le port de trois mille.

44
00:03:18,870 --> 00:03:28,620
Donc, si je vais au port trois mille maintenant et la façon dont j'arrive est l'hôte local Colan 3000, je vois quelque chose qui dit page d'accueil.

45
00:03:28,980 --> 00:03:34,570
Parlons de la façon dont j'obtiens cette page d'accueil HMO si nous visualisons la source de la page.

46
00:03:34,950 --> 00:03:42,150
Vous pouvez voir tout ce que j'ai obtenu comme une réponse était un seul H-1 qui dit page d'accueil et c'est tout.

47
00:03:42,150 --> 00:03:46,620
Donc, si je retourne à mon serveur ici, il ya quelques choses que je veux souligner.

48
00:03:46,770 --> 00:03:52,620
Le premier est que dans mon terminal où le serveur a démarré il ya un petit message qui a été imprimé.

49
00:03:52,780 --> 00:04:00,340
Et ce que cela nous dit, c'est que quelqu'un a fait une demande d'obtenir qui est ce que cela dit ici à la barrele vous arole.

50
00:04:00,630 --> 00:04:02,750
Donc localhost 3000 slash.

51
00:04:02,820 --> 00:04:04,160
Il n'y a rien après.

52
00:04:04,530 --> 00:04:10,560
Nous appelons cela le chemin racine ou juste route qui est essentiellement ce que nous voulons que notre page d'accueil pour être.

53
00:04:10,560 --> 00:04:15,840
Encore une fois, je suis allé à localhost 3000 et appuyez sur Entrée.

54
00:04:16,200 --> 00:04:38,430
Et qui m'a obtenu du code, mais si je suis allé à localhost 3000 slash chiens qui me donne des trucs différents en arrière si je vois la page source sur ce peut voir si nous obtenons un peu plus de contenu qui est différent que le contenu que nous avons obtenu la première fois et C'est parce que c'est une rangée différente ou une route différente.

55
00:04:38,430 --> 00:04:42,670
Donc, dans ce cas, je ne demandais pas Slash.

56
00:04:42,840 --> 00:04:44,840
Je demandais des chiens Slash.

57
00:04:45,210 --> 00:04:54,570
Et si vous regardez dans la sortie du terminal, vous pouvez voir qu'il ya une différence entre une demande d'obtenir une barre oblique ou une demande d'obtenir des chiens slash.

58
00:04:54,570 --> 00:04:59,630
Cela me montre juste que je peux vous montrer ce qui se passe, mais ce n'est pas la logique ou quoi que ce soit.

59
00:04:59,640 --> 00:05:03,010
C'est juste une fenêtre sur les demandes qui sont faites.

60
00:05:03,390 --> 00:05:05,330
OK, c'est le côté demande des choses.

61
00:05:05,430 --> 00:05:08,760
Quand je frappe entrer je fais une demande.

62
00:05:08,760 --> 00:05:09,720
Même chose ici.

63
00:05:09,930 --> 00:05:12,430
Je suis juste faire à deux endroits différents.

64
00:05:12,780 --> 00:05:16,680
Et bien sûr, je peux faire ces demandes obtenir avec le facteur ainsi.

65
00:05:16,680 --> 00:05:21,250
Alors faisons et obtenons une requête à localhost 3000 comme ça.

66
00:05:21,300 --> 00:05:25,890
Prenez un moment et réfléchissez à ce que vous attendez que nous voyions quand je frappe envoyer.

67
00:05:27,100 --> 00:05:43,490
Là-bas, je viens d'obtenir exactement le même H-1 et si je ne l'hôte local 3000 slash chiens qui est une demande d'obtenir et je frappe envoyer, je reçois le même courrier HD que nous avons quand j'ai fait une demande d'obtenir dans le navigateur en frappant Entrer.

68
00:05:43,500 --> 00:05:47,790
Maintenant, nous allons parler de la logique qui rend tout cela se produire sur le côté serveur.

69
00:05:48,110 --> 00:05:54,940
Je vais donc revenir au sublime et me concentrer sur ces trois parties ici et en particulier ces deux.

70
00:05:55,320 --> 00:06:00,230
Je sais que je suis un disque cassé sur ce sujet, mais la syntaxe n'est pas la partie importante.

71
00:06:00,270 --> 00:06:04,960
Nous allons passer tellement de temps sur l'écriture de ces routes que ce n'est pas significatif.

72
00:06:05,010 --> 00:06:15,450
Ce qui est significatif, c'est que dans ce premier morceau petit ce code est à l'écoute pour obtenir une demande de barre oblique afin d'obtenir slash.

73
00:06:15,720 --> 00:06:20,400
Et quand cela se produit nous rendons une page appelée maison.

74
00:06:20,400 --> 00:06:29,690
Donc, encore une fois quand une demande d'achat est faite pour slash localhost 3000 slash rien d'autre alors nous allons rendre quelque chose appelé home.

75
00:06:30,030 --> 00:06:32,660
Et ici j'ai le fichier appelé home.

76
00:06:32,670 --> 00:06:34,560
Peu importe ce que le Ejing yess.

77
00:06:34,860 --> 00:06:38,360
Et à l'intérieur il ya un H1 qui dit page d'accueil.

78
00:06:38,430 --> 00:06:45,980
Donc ajoutons quelque chose d'autre dans un paragraphe bas juste comme ça et sauver.

79
00:06:46,720 --> 00:06:58,740
Et maintenant, quand ils font une demande d'obtenir seulement une demande d'obtenir une barre oblique je obtenir le contenu de cette maison de fichier renvoyé à moi et pour que ces changements de travail, je dois réellement redémarrer mon serveur.

80
00:06:58,800 --> 00:07:07,590
Alors je vais commencer maintenant et regarder, je vais mettre cela sur le côté et je vais revenir à Chrome obtenir mon serveur là encore.

81
00:07:08,220 --> 00:07:11,730
Je vais faire une demande de get à localhost 3000.

82
00:07:11,970 --> 00:07:16,380
Comme vous pouvez le voir, il me dit qu'une demande d'achat a été faite pour slash.

83
00:07:16,830 --> 00:07:19,530
Et nous avons récupéré ce contenu.

84
00:07:19,590 --> 00:07:26,480
Encore une fois, notre code ici est à l'écoute pour obtenir des requêtes slash et de décider quel fichier à renvoyer.

85
00:07:26,490 --> 00:07:33,550
Maintenant, voici une autre version plus compliquée de celle où nous sommes à l'écoute pour une demande d'obtenir des chiens de chasse.

86
00:07:33,930 --> 00:07:36,250
Et puis il ya un autre code qui se passe ici.

87
00:07:36,390 --> 00:07:37,740
Et je vais juste lire un commentaire.

88
00:07:37,740 --> 00:07:44,930
Tout ce qui se passe ici est d'obtenir tous les chiens de la base de données, donc j'ai certains dans notre base de données déjà.

89
00:07:45,190 --> 00:07:54,350
Et puis la prochaine partie est de rendre le dossier chiens et nous allons juste laisser à cela pour l'instant.

90
00:07:54,390 --> 00:07:59,430
Donc nous obtenons tous les chiens dans la base de données et rendant le dossier de chiens qui est juste ici.

91
00:07:59,710 --> 00:08:01,390
Et celui-ci est un peu différent.

92
00:08:01,410 --> 00:08:02,940
Ce n'est pas seulement lui.

93
00:08:02,970 --> 00:08:05,740
Nous avons des choses étranges que nous n'avons pas vues auparavant.

94
00:08:06,030 --> 00:08:14,230
Mais à la fin de la journée ce qui se passe quand je vais à chiens de chasse notre application est à l'écoute pour obtenir une demande de chiens de chasse.

95
00:08:14,340 --> 00:08:22,330
Quand il en obtient un, il récupère tous les chiens dans la base de données et chacun a un nom et ou race et puis il fait un petit mensonge pour chacun.

96
00:08:22,470 --> 00:08:25,600
Donc, chacun d'eux est un allié avec un nom et une race.

97
00:08:26,100 --> 00:08:38,740
Donc, encore une fois, nous avons deux lignes de slash comme une demande d'obtenir et slash chiens comme une demande d'obtenir et nous obtenons deux fichiers différents et un peu de logique quand nous allons à chiens de chiens contre quand nous allons juste à la barre oblique.

98
00:08:38,880 --> 00:08:41,910
Il n'y a pas de logique rien ne se passe avec la base de données.

99
00:08:41,910 --> 00:08:44,530
C'est juste nous donner une page statique.

100
00:08:44,880 --> 00:08:46,140
Mais ce n'est pas statique.

101
00:08:46,260 --> 00:08:49,260
Cela dépend de ce qui vient de la base de données.

102
00:08:50,160 --> 00:08:56,830
Revenez au serveur ici à notre code et je parlerai un peu de cette ligne ici.

103
00:08:57,480 --> 00:09:02,910
Donc, nous rendons une page un modèle appelé chiens qui est ce qui est écrit ici chiens.

104
00:09:03,120 --> 00:09:23,890
Oui, mais nous passons des données à ce modèle parce que cela n'a pas un allié ici qui dit resti dash mutt et il n'a pas un autre plus tard dans le modèle qui dit pourquoi il tirez doré comme vous pouvez le voir c'est ce que nous 'Re obtenir dans le navigateur.

105
00:09:24,000 --> 00:09:26,160
Mais notre dossier n'a rien de tout cela.

106
00:09:26,250 --> 00:09:27,810
Et c'est ce qui le rend dynamique.

107
00:09:27,840 --> 00:09:32,970
Ce fichier peut être différent chaque fois qu'il s'exécute en fonction de ce qui est dans la base de données.

108
00:09:32,970 --> 00:09:51,000
Donc, ce que nous faisons réellement est de définir un modèle ou un modèle pour ce que nous voulons arriver qui est pour chaque truc chien chien pour chacun, nous voulons faire un allié où nous allons faire le nom gras ou forte tiret la race tout comme Texte brut.

109
00:09:51,000 --> 00:10:02,610
Voilà comment nous nous retrouvons avec cela pour chaque chien dans la base de données que nous récupérons, nous allons boucler et faire un seul allié avec le nom en gras tirez qui ne race pas en gras.

110
00:10:02,610 --> 00:10:03,780
Alors laissez-le à cela.

111
00:10:03,780 --> 00:10:05,010
Résumons maintenant.

112
00:10:05,160 --> 00:10:10,140
Donc, nous avons notre code qui crée le serveur ici.

113
00:10:10,140 --> 00:10:13,820
Tout cela est le seul code responsable de la création de notre serveur.

114
00:10:13,950 --> 00:10:16,190
Nous avons un code mis en place n'est pas vraiment important.

115
00:10:16,200 --> 00:10:18,820
Quelque code de base de données importe peu non plus.

116
00:10:18,840 --> 00:10:21,320
Et puis ces deux itinéraires et ceux qui importent beaucoup.

117
00:10:21,630 --> 00:10:30,180
Ainsi ceci est comment nous obtenons le code différent et les différents dossiers selon le vous êtes tout ce que nous demandons que nous fassions une demande à la barre oblique comme elle obtiennent la demande.

118
00:10:30,330 --> 00:10:38,280
Nous obtenons un dossier à la maison que nous faisons une demande de slash de chiens et un peu plus se produit dans les coulisses.

119
00:10:38,430 --> 00:10:42,720
Il trouve tous les chiens dans la base de données et ensuite il rend que les chiens de fichier.

120
00:10:42,930 --> 00:10:49,170
Mais le dossier des chiens est dynamique car il prend un tas de chiens et pour chacun.

121
00:10:49,170 --> 00:10:50,410
Il fait un allié.

122
00:10:50,520 --> 00:10:55,230
Donc, si nous avions 10000 chiens dans la base de données, nous aurions 10000 alliés.

123
00:10:55,920 --> 00:11:08,490
Et le dernier point que je veux faire est que nous avons un éditeur de texte ici que j'ai un terminal où je suis en cours d'exécution du serveur et puis je vais dans le navigateur et visiter cette page web en faisant une demande.

124
00:11:08,520 --> 00:11:10,370
Voilà les trois outils dont nous avons besoin.

125
00:11:10,410 --> 00:11:19,780
Donc, ces trois choses l'éditeur de texte où nous écrivons le code au terminal ou quelque part où nous pouvons démarrer le serveur et l'avoir à l'écoute.

126
00:11:20,100 --> 00:11:24,420
Et puis enfin un navigateur où nous pouvons réellement aller et faire des demandes.

127
00:11:24,630 --> 00:11:34,540
Donc, nous n'avons pas à utiliser un navigateur Nous pourrions utiliser le facteur, mais personne n'utilise le facteur pour réellement interagir avec notre page Web dans les prochaines vidéos lorsque nous commençons à écrire nos propres applications Web.

128
00:11:34,560 --> 00:11:36,780
Nous aurons ces trois mêmes outils.

129
00:11:36,960 --> 00:11:42,440
Donc, nous allons avoir un éditeur de texte un navigateur et un terminal ou quelque part pour exécuter le serveur.