1
00:00:00,210 --> 00:00:01,510
Bene, torna indietro.

2
00:00:01,530 --> 00:00:04,700
Quindi questa è una delle lezioni più importanti dell'intero corso.

3
00:00:04,890 --> 00:00:08,670
Ma sarà anche molto diverso da tutto ciò che abbiamo fatto finora.

4
00:00:08,670 --> 00:00:13,260
E la ragione per cui è diverso è che ti mostrerò un mucchio di

5
00:00:13,260 --> 00:00:18,120
codice che non hai mai visto prima e che non ti aspetti affatto di capire.

6
00:00:18,120 --> 00:00:23,730
La ragione per cui sto facendo questo è che voglio darti una panoramica concettuale di come tutti questi pezzi combaciano.

7
00:00:23,790 --> 00:00:28,430
Il database del server richiede GET post richiede il browser.

8
00:00:28,440 --> 00:00:30,900
Tutte queste richieste e risposte di cose diverse.

9
00:00:31,080 --> 00:00:35,430
Voglio mostrare tutto ciò con un'applicazione di lavoro davvero semplice.

10
00:00:35,430 --> 00:00:37,120
Quindi è quello che farò qui.

11
00:00:37,200 --> 00:00:42,900
Se stavo insegnando questo di persona questo sarebbe il punto in cui ti chiedo di mettere il tuo laptop in giù per

12
00:00:42,900 --> 00:00:43,920
chiudere il tuo computer.

13
00:00:44,040 --> 00:00:45,670
Ovviamente non è una buona idea qui.

14
00:00:45,930 --> 00:00:50,100
Ma il sentimento dietro questo è che non voglio che tu prenda appunti su questo.

15
00:00:50,100 --> 00:00:54,780
Stiamo andando a esaminare ogni singola riga e scriverla da zero e realizzare cinque sei

16
00:00:54,780 --> 00:00:57,240
sette di queste diverse app utilizzando questi concetti.

17
00:00:57,240 --> 00:01:03,580
Quindi questo è solo il modo in cui le cose si incastrano non i dettagli reali di come funzionano.

18
00:01:03,600 --> 00:01:06,630
Detto questo, andiamo avanti e cominciamo qui.

19
00:01:07,020 --> 00:01:09,840
Quindi questa applicazione è a tema intorno ai cani.

20
00:01:09,840 --> 00:01:11,010
È molto, molto semplice

21
00:01:11,010 --> 00:01:12,320
Nessuno stile.

22
00:01:12,420 --> 00:01:14,320
Solo poche pagine diverse.

23
00:01:14,430 --> 00:01:19,250
E la prima cosa di cui dobbiamo parlare è che cos'è questo intero file.

24
00:01:19,260 --> 00:01:21,750
Quindi questo è il nostro file server.

25
00:01:21,750 --> 00:01:23,450
Nel mio caso si chiama app dodge.

26
00:01:23,460 --> 00:01:25,720
Sì, questo è scritto in Javascript.

27
00:01:25,800 --> 00:01:30,180
E quando eseguo questo file, avvierà effettivamente un server per me.

28
00:01:30,180 --> 00:01:37,560
Quindi, quando ho menzionato prima, quando inviamo una richiesta per leggerla, c'è il codice sul server

29
00:01:37,560 --> 00:01:41,310
Reddit che sta ascoltando una richiesta per leggerlo.

30
00:01:41,310 --> 00:01:45,850
Ora com slash search e poi ti rimanda i dati corretti in una risposta.

31
00:01:46,080 --> 00:01:50,990
Quando dico che c'è il codice sul server Reddit questo è il tipo di codice di cui stiamo parlando.

32
00:01:51,210 --> 00:01:56,730
Questo è il nostro codice sul server che sta ascoltando richieste diverse e quindi risponde con pezzi diversi.

33
00:01:56,790 --> 00:02:00,620
Quindi anche se read è fatto in Python e questo è javascript

34
00:02:00,630 --> 00:02:05,150
Ci sono tre grandi blocchi e questo in alto è solo ottenere la nostra applicazione impostata.

35
00:02:05,250 --> 00:02:09,370
Quindi includendo le librerie giuste come puoi vedere ci sono alcune dipendenze.

36
00:02:09,390 --> 00:02:11,560
Di nuovo li esamineremo tutti più tardi.

37
00:02:11,850 --> 00:02:13,570
Quindi abbiamo alcune cose del database.

38
00:02:13,830 --> 00:02:20,910
Quindi questo è impostare il nostro database in modo che il nostro database sappia che ogni cane ha un nome e una razza

39
00:02:20,910 --> 00:02:22,060
e sono entrambi stringhe.

40
00:02:22,470 --> 00:02:24,240
E questo è tutto citato per ora.

41
00:02:24,630 --> 00:02:28,590
E poi ci sono queste cose chiamate wraps, dove trascorriamo la maggior parte del

42
00:02:28,590 --> 00:02:34,170
nostro tempo in questa lezione prima di farlo, anche se voglio sottolineare la parte più importante per avviare effettivamente

43
00:02:34,470 --> 00:02:39,040
il server che è proprio alla fine qui linea non importa la sintassi ma cosa importa.

44
00:02:39,050 --> 00:02:40,930
C'è il numero qui tremila.

45
00:02:40,950 --> 00:02:46,320
Ciò che questo farà sarà quando eseguiremo questa applicazione quando eseguirò questo file nel mio

46
00:02:46,320 --> 00:02:51,860
terminale che inizierà effettivamente a server up e la nostra applicazione sarà sulla porta 3000.

47
00:02:51,870 --> 00:02:53,160
Quindi lascia che ti mostri cosa intendo.

48
00:02:53,160 --> 00:02:58,200
Ho intenzione di avviare questo server eseguendo il file di nuovo non importa quello che sto facendo lì.

49
00:02:59,130 --> 00:03:03,260
E puoi vedere che ricevo un messaggio che serve la demo del cane sulla porta 3000.

50
00:03:03,570 --> 00:03:07,650
Quindi quello che ho il mio editor di testo sto scrivendo il codice qui per il mio server.

51
00:03:07,860 --> 00:03:11,000
Quindi nel mio terminale sto effettivamente eseguendo il server.

52
00:03:11,220 --> 00:03:17,280
Quindi ora questo codice viene eseguito tutto questo codice viene eseguito e questa linea in particolare ha avviato

53
00:03:17,280 --> 00:03:18,840
un server sulla porta tremila.

54
00:03:18,870 --> 00:03:26,850
Quindi se vado al porto tremila ora e il modo in cui arrivo lì è il padrone di casa Colan 3000 vedo qualcosa

55
00:03:26,850 --> 00:03:28,620
che dice la home page.

56
00:03:28,980 --> 00:03:34,570
Parliamo di come otterrò l'HMO della home page se visualizziamo l'origine della pagina.

57
00:03:34,950 --> 00:03:42,150
Puoi vedere tutto quello che ho ricevuto come risposta era un singolo H-1 che dice home page e basta.

58
00:03:42,150 --> 00:03:46,620
Quindi se torno al mio server qui ci sono alcune cose che voglio sottolineare.

59
00:03:46,770 --> 00:03:51,870
Il primo è che nel mio terminale in cui è stato avviato il server c'è un piccolo messaggio che

60
00:03:51,870 --> 00:03:52,620
è stato stampato.

61
00:03:52,780 --> 00:03:59,060
E ciò che questo ci dice è che qualcuno ha fatto una richiesta di ottenere che è ciò che questo dice

62
00:03:59,150 --> 00:04:00,340
qui al tuo arole.

63
00:04:00,630 --> 00:04:02,750
Quindi localhost 3000 slash.

64
00:04:02,820 --> 00:04:04,160
Quindi non c'è niente dopo.

65
00:04:04,530 --> 00:04:10,560
Noi chiamiamo questo il percorso radice o semplicemente il percorso che è fondamentalmente ciò che vogliamo che sia la nostra home page.

66
00:04:10,560 --> 00:04:15,840
Quindi di nuovo sono andato su localhost 3000 e ho premuto invio.

67
00:04:16,200 --> 00:04:24,120
E questo mi ha dato un po 'di codice, ma se andassi a localhost 3000 slash dogs che mi restituissero un po' di roba diversa

68
00:04:24,120 --> 00:04:26,190
se guardassi il sorgente della pagina

69
00:04:29,760 --> 00:04:35,040
su questo posso vedere se otteniamo più contenuti diversi dal contenuto che abbiamo ottenuto la prima

70
00:04:35,040 --> 00:04:38,430
volta questo perché è una riga diversa o una rotta diversa.

71
00:04:38,430 --> 00:04:42,670
Quindi in questo caso non stavo solo chiedendo Slash.

72
00:04:42,840 --> 00:04:44,840
Stavo chiedendo dei cani Slash.

73
00:04:45,210 --> 00:04:51,510
E se guardi nell'output del terminale puoi vedere che c'è una differenza tra una richiesta di ottenere una

74
00:04:51,990 --> 00:04:54,570
barra o una richiesta di rimozione dei cani.

75
00:04:54,570 --> 00:04:59,630
Questo mi sta solo mostrando così posso mostrarti cosa sta succedendo ma questa non è logica o niente.

76
00:04:59,640 --> 00:05:03,010
È solo una finestra sulle richieste che vengono fatte.

77
00:05:03,390 --> 00:05:05,330
OK, questo è il lato delle richieste.

78
00:05:05,430 --> 00:05:08,760
Quando premo invio, faccio una richiesta.

79
00:05:08,760 --> 00:05:09,720
La stessa cosa qui.

80
00:05:09,930 --> 00:05:12,430
Li sto facendo solo in due posti diversi.

81
00:05:12,780 --> 00:05:16,680
E naturalmente posso far sì che ricevano richieste anche con il postino.

82
00:05:16,680 --> 00:05:21,250
Quindi facciamo e otteniamo la richiesta di localhost 3000 proprio così.

83
00:05:21,300 --> 00:05:25,890
Prenditi un momento e pensa a cosa ti aspetti di vedere quando clicco invio.

84
00:05:27,100 --> 00:05:34,590
Eccoci, ho appena ottenuto la stessa identica H-1 e se faccio un host locale 3000 slash dogs che è una

85
00:05:35,010 --> 00:05:42,240
richiesta get e premo invio ricevo la stessa mail HD che abbiamo ottenuto quando ho fatto una richiesta get

86
00:05:42,240 --> 00:05:43,490
nel browser colpendo accedere.

87
00:05:43,500 --> 00:05:47,790
Ora parliamo della logica che fa accadere tutto ciò dal lato server.

88
00:05:48,110 --> 00:05:54,300
al sublime e mi concentrerò su queste tre parti proprio qui e in particolare su queste due.

89
00:05:54,300 --> 00:05:54,940
Quindi tornerò

90
00:05:55,320 --> 00:06:00,230
So di essere un disco rotto su questo argomento ma la sintassi non è la parte importante.

91
00:06:00,270 --> 00:06:04,960
Trascorreremo così tanto tempo a scrivere effettivamente queste rotte che non è significativo.

92
00:06:05,010 --> 00:06:13,050
Ciò che è significativo è che in questo primo piccolo pezzo questo codice è in attesa di una richiesta di ottenere una barra

93
00:06:13,860 --> 00:06:15,450
per ottenere una barra.

94
00:06:15,720 --> 00:06:20,400
E quando ciò accade, stiamo rendendo una pagina chiamata home.

95
00:06:20,400 --> 00:06:27,630
Quindi, di nuovo, quando viene richiesta una richiesta per tagliare la barra locale di localhost 3000 nient'altro,

96
00:06:27,630 --> 00:06:29,690
allora renderemo qualcosa chiamato home.

97
00:06:30,030 --> 00:06:32,660
E qui ho il file chiamato home.

98
00:06:32,670 --> 00:06:34,560
Non importa cosa siano gli Ejay.

99
00:06:34,860 --> 00:06:38,360
E al suo interno c'è un H1 che dice homepage.

100
00:06:38,430 --> 00:06:45,980
Quindi aggiungiamo qualcos'altro in un paragrafo basso proprio così e salviamo.

101
00:06:46,720 --> 00:06:53,910
E ora quando fanno una richiesta di ottenere solo una richiesta di tagliando mi viene restituito il contenuto di

102
00:06:54,060 --> 00:06:58,740
quel file e per far funzionare le modifiche devo riavviare il mio server.

103
00:06:58,800 --> 00:07:06,690
Quindi inizierò ora e vedrò di metterlo da parte e tornerò su Chrome per ottenere di nuovo il

104
00:07:06,690 --> 00:07:07,590
mio server.

105
00:07:08,220 --> 00:07:11,730
Ho intenzione di ottenere una richiesta di localhost 3000.

106
00:07:11,970 --> 00:07:16,380
Come puoi vedere, mi dice che è stata fatta una richiesta per tagliare.

107
00:07:16,830 --> 00:07:19,530
E abbiamo recuperato questo contenuto.

108
00:07:19,590 --> 00:07:26,480
Quindi di nuovo il nostro codice qui sta ascoltando, otteniamo una barra delle richieste e decidiamo quale file inviare.

109
00:07:26,490 --> 00:07:32,580
Ora ecco un'altra versione più complicata di quella in cui stiamo ascoltando una richiesta di prelievo

110
00:07:32,670 --> 00:07:33,550
di cani.

111
00:07:33,930 --> 00:07:36,250
E poi c'è un altro codice che sta accadendo qui.

112
00:07:36,390 --> 00:07:37,740
E mi limiterò a leggere un commento.

113
00:07:37,740 --> 00:07:44,930
Tutto ciò che accade qui è ottenere tutti i cani dal database, quindi ho già alcuni nel nostro database.

114
00:07:45,190 --> 00:07:54,350
E poi la prossima parte è rendere il file dei cani e lo lasceremo per ora.

115
00:07:54,390 --> 00:07:59,430
Quindi stiamo prendendo tutti i cani nel database e rendiamo il file dei cani che è proprio qui.

116
00:07:59,710 --> 00:08:01,390
E questo sembra un po 'diverso.

117
00:08:01,410 --> 00:08:02,940
Non è solo lui.

118
00:08:02,970 --> 00:08:05,740
Abbiamo alcune cose strane qui che non abbiamo visto prima.

119
00:08:06,030 --> 00:08:13,150
Ma alla fine della giornata quello che succede è quando vado a tagliare i cani, la nostra app è in attesa di una richiesta

120
00:08:13,150 --> 00:08:14,230
per tagliare i cani.

121
00:08:14,340 --> 00:08:19,980
Quando ne ottiene uno recupera tutti i cani nel database e ognuno ha un nome o una razza

122
00:08:19,980 --> 00:08:22,330
e quindi fa una piccola bugia per ognuno.

123
00:08:22,470 --> 00:08:25,600
Quindi ognuno di questi è un alleato con un nome e una razza.

124
00:08:26,100 --> 00:08:32,640
Quindi, di nuovo abbiamo due barre come una richiesta di ottenere e cani slash come richiesta di ottenere e otteniamo

125
00:08:32,640 --> 00:08:38,740
due file diversi e un po 'di logica quando andiamo a tagliare i cani contro quando andiamo a tagliare.

126
00:08:38,880 --> 00:08:41,910
Non c'è alcuna logica che accada nulla sta accadendo con il database.

127
00:08:41,910 --> 00:08:44,530
Ci sta solo dando una pagina statica.

128
00:08:44,880 --> 00:08:46,140
Ma questo non è statico.

129
00:08:46,260 --> 00:08:49,260
Questo dipende da ciò che proviene dal database.

130
00:08:50,160 --> 00:08:56,830
Torna al server qui per il nostro codice e parlerò un po 'di questa linea qui.

131
00:08:57,480 --> 00:09:02,910
Quindi rendiamo una pagina un modello chiamato Cani che è ciò che è scritto proprio qui cani.

132
00:09:03,120 --> 00:09:13,830
Sì, ma stiamo trasmettendo dati a questo modello perché questo non ha un alleato qui che dice resta dash mutt e non ne ha

133
00:09:14,230 --> 00:09:20,970
un altro in seguito nel modello che dice perché precipita d'oro come puoi vedere è

134
00:09:20,970 --> 00:09:23,890
così che noi stai entrando nel browser.

135
00:09:24,000 --> 00:09:26,160
Ma il nostro file non ha nulla di tutto ciò.

136
00:09:26,250 --> 00:09:27,810
E questo è ciò che lo rende dinamico.

137
00:09:27,840 --> 00:09:32,970
Questo file può essere diverso ogni volta che viene eseguito a seconda di cosa c'è nel database.

138
00:09:32,970 --> 00:09:39,780
Quindi, quello che effettivamente facciamo è definire un modello o un modello per ciò che vogliamo che è

139
00:09:39,780 --> 00:09:48,150
per ogni roba di cane per ognuno di noi che vogliamo creare un alleato dove faremo il nome in grassetto o forte

140
00:09:48,300 --> 00:09:51,000
come la razza proprio come testo normale

141
00:09:51,000 --> 00:09:55,800
Quindi è così che finiamo con questo per ogni cane nel database

142
00:09:55,800 --> 00:10:02,610
che recuperiamo, passeremo e creeremo un singolo alleato con il nome in grassetto che non è in grassetto.

143
00:10:02,610 --> 00:10:03,780
Quindi lascia perdere.

144
00:10:03,780 --> 00:10:05,010
Riassumiamo ora.

145
00:10:05,160 --> 00:10:10,140
Quindi abbiamo il nostro codice che crea il server proprio qui.

146
00:10:10,140 --> 00:10:13,820
Tutto questo è l'unico codice responsabile della creazione del nostro server.

147
00:10:13,950 --> 00:10:16,190
Abbiamo qualche codice di installazione non importa.

148
00:10:16,200 --> 00:10:18,820
Anche alcuni codici di database non sono importanti.

149
00:10:18,840 --> 00:10:21,320
E poi questi due percorsi e quelli contano molto.

150
00:10:21,630 --> 00:10:27,240
Quindi questo è il modo in cui otteniamo codice diverso e file diversi a seconda del fatto che tu sei tutto ciò che chiediamo di

151
00:10:27,780 --> 00:10:30,180
fare una richiesta di barrare man mano che riceve la richiesta.

152
00:10:30,330 --> 00:10:38,040
Riceviamo un file a casa, facciamo una richiesta per tagliare i cani e un po 'di più succede dietro le quinte.

153
00:10:38,430 --> 00:10:42,720
Trova tutti i cani nel database e quindi esegue il rendering dei file dei cani.

154
00:10:42,930 --> 00:10:49,170
Ma il file dei cani è dinamico perché contiene un mucchio di cani e per ciascuno.

155
00:10:49,170 --> 00:10:50,410
È un alleato.

156
00:10:50,520 --> 00:10:55,230
Quindi se avessimo 10000 cani nel database avremmo finito con 10000 alleati.

157
00:10:55,920 --> 00:11:01,770
E l'ultimo punto che voglio fare è che qui abbiamo un editor di testo che ho un terminale in

158
00:11:01,770 --> 00:11:07,650
cui sto eseguendo il server e poi sto andando nel browser e visitando quella pagina web facendo una richiesta.

159
00:11:08,520 --> 00:11:10,370
Questi sono i tre strumenti di cui abbiamo bisogno.

160
00:11:10,410 --> 00:11:16,830
cui scriviamo il codice al terminale o da qualche parte dove possiamo avviare il server e farlo ascoltare.

161
00:11:16,830 --> 00:11:19,780
Quindi queste tre cose sono l'editor di testo in

162
00:11:20,100 --> 00:11:24,420
E infine un browser in cui possiamo effettivamente andare a fare richieste.

163
00:11:24,630 --> 00:11:29,940
Quindi non dobbiamo usare un browser Potremmo usare il postino ma nessuno usa il postino per interagire effettivamente

164
00:11:29,940 --> 00:11:34,540
con la nostra pagina web nei prossimi video quando iniziamo a scrivere le nostre applicazioni web.

165
00:11:34,560 --> 00:11:36,780
Avremo quei tre stessi strumenti.

166
00:11:36,960 --> 00:11:42,440
Quindi avremo un editor di testo un browser e un terminale o da qualche parte per eseguire il server.