1
00:00:00,210 --> 00:00:01,510
Bem vindo de volta.

2
00:00:01,530 --> 00:00:04,700
Então, esta é uma das lições mais importantes em todo o curso.

3
00:00:04,890 --> 00:00:08,670
Mas também será muito diferente de tudo o que fizemos até agora.

4
00:00:08,670 --> 00:00:13,260
E a razão pela qual é diferente é que eu vou mostrar-lhe um monte

5
00:00:13,260 --> 00:00:18,120
de código que você nunca viu antes e que não se espera que você entenda.

6
00:00:18,120 --> 00:00:23,730
A razão pela qual estou fazendo isso é que eu quero dar uma visão conceitual de como todas essas peças se encaixam.

7
00:00:23,790 --> 00:00:28,430
O banco de dados onde a solicitação de solicitação do servidor solicita o navegador.

8
00:00:28,440 --> 00:00:30,900
Todas essas solicitações e respostas diferentes.

9
00:00:31,080 --> 00:00:35,430
Quero mostrar tudo isso com uma aplicação de trabalho realmente simples.

10
00:00:35,430 --> 00:00:37,120
Então é o que eu vou fazer aqui.

11
00:00:37,200 --> 00:00:42,900
Se eu ensinasse isso pessoalmente, esse seria o ponto em que eu pedi para você colocar o laptop para

12
00:00:42,900 --> 00:00:43,920
fechar seu computador.

13
00:00:44,040 --> 00:00:45,670
Obviamente, não é uma boa idéia aqui.

14
00:00:45,930 --> 00:00:50,100
Mas o sentimento por trás disso é que eu não quero que você esteja tomando notas sobre isso.

15
00:00:50,100 --> 00:00:54,780
Vamos examinar todas as linhas e escrevê-lo a partir do zero e fazer cinco

16
00:00:54,780 --> 00:00:57,240
seis sete desses aplicativos diferentes usando esses conceitos.

17
00:00:57,240 --> 00:01:03,580
Então, trata-se apenas de como as coisas se encaixam e não os detalhes reais de como elas funcionam.

18
00:01:03,600 --> 00:01:06,630
Com isso dito vamos seguir em frente e começar aqui.

19
00:01:07,020 --> 00:01:09,840
Então, este aplicativo é temático em torno de cães.

20
00:01:09,840 --> 00:01:11,010
É muito muito simples.

21
00:01:11,010 --> 00:01:12,320
Sem nenhum estilo.

22
00:01:12,420 --> 00:01:14,320
Apenas algumas páginas diferentes.

23
00:01:14,430 --> 00:01:19,250
E a primeira coisa sobre a qual precisamos falar é o que é esse arquivo completo.

24
00:01:19,260 --> 00:01:21,750
Então este é o nosso arquivo de servidor.

25
00:01:21,750 --> 00:01:23,450
No meu caso, ele é chamado de esquiva de aplicativos.

26
00:01:23,460 --> 00:01:25,720
Sim, isso está escrito em Javascript.

27
00:01:25,800 --> 00:01:30,180
E quando eu executar este arquivo, ele realmente iniciará um servidor para mim.

28
00:01:30,180 --> 00:01:37,560
Então, quando eu mencionei antes, quando enviamos um pedido para lê-lo com ponto de busca, há código no

29
00:01:37,560 --> 00:01:41,310
servidor Reddit que está ouvindo um pedido para lê-lo.

30
00:01:41,310 --> 00:01:45,850
Agora, procure uma busca e, em seguida, envia de volta os dados corretos em uma resposta.

31
00:01:46,080 --> 00:01:50,990
Quando quando digo que há código no servidor Reddit, esse é o tipo de código do qual estamos falando.

32
00:01:51,210 --> 00:01:56,730
Este é o nosso código no servidor que está ouvindo diferentes solicitações e depois respondendo com peças diferentes.

33
00:01:56,790 --> 00:02:00,620
Então, mesmo que a leitura seja feita em Python e isso é javascript

34
00:02:00,630 --> 00:02:05,150
Existem três grandes pedaços e este é o primeiro a obter o nosso aplicativo configurado.

35
00:02:05,250 --> 00:02:09,370
Então, incluindo as bibliotecas corretas, como você pode ver, há algumas dependências.

36
00:02:09,390 --> 00:02:11,560
Mais uma vez, passaremos por todos mais tarde.

37
00:02:11,850 --> 00:02:13,570
Então, temos algumas coisas de banco de dados.

38
00:02:13,830 --> 00:02:20,910
Então, isso está configurando nosso banco de dados para que nosso banco de dados conheça todos os cães tem um nome e uma raça e eles

39
00:02:20,910 --> 00:02:22,060
são ambas as cordas.

40
00:02:22,470 --> 00:02:24,240
E isso é tudo mencionado sobre isso por enquanto.

41
00:02:24,630 --> 00:02:28,590
E então, essas coisas são chamadas de wraps, onde é que vamos gastar a maior

42
00:02:28,590 --> 00:02:34,170
parte do tempo nesta lição antes de fazer isso, embora eu queira apontar a parte mais importante para realmente iniciar o

43
00:02:34,470 --> 00:02:39,040
servidor, que está no final de tudo aqui. A linha não importa a sintaxe, mas o que importa.

44
00:02:39,050 --> 00:02:40,930
Há três mil números.

45
00:02:40,950 --> 00:02:46,320
O que isso fará é quando executamos este aplicativo quando eu executo este arquivo

46
00:02:46,320 --> 00:02:51,860
no meu terminal, ele realmente iniciará o servidor e nossa aplicação estará na porta 3000.

47
00:02:51,870 --> 00:02:53,160
Então, deixe-me mostrar o que quero dizer.

48
00:02:53,160 --> 00:02:58,200
Eu vou começar este servidor, executando o arquivo novamente realmente não importa o que estou fazendo lá.

49
00:02:59,130 --> 00:03:03,260
E você pode ver que recebo uma mensagem que serve a demonstração do cão na porta 3000.

50
00:03:03,570 --> 00:03:07,650
Então, o que eu tenho meu editor de texto, eu escrevo o código aqui para o meu servidor.

51
00:03:07,860 --> 00:03:11,000
Então no meu terminal, eu realmente estou executando o servidor.

52
00:03:11,220 --> 00:03:17,280
Então, agora este código está sendo executado, todo esse código é executado e esta linha, em particular, iniciou um

53
00:03:17,280 --> 00:03:18,840
servidor na porta três mil.

54
00:03:18,870 --> 00:03:26,850
Então, se eu for para o porto três mil agora e a maneira como eu chegar lá é o host local Colan 3000, eu vejo

55
00:03:26,850 --> 00:03:28,620
algo que diz página inicial.

56
00:03:28,980 --> 00:03:34,570
Vamos falar sobre como eu estou obtendo esse HMO da página inicial se visualizarmos a fonte da página.

57
00:03:34,950 --> 00:03:42,150
Você pode ver tudo o que eu recebi quando uma resposta foi uma única H-1 que diz página inicial e é isso.

58
00:03:42,150 --> 00:03:46,620
Então, se eu voltar para o servidor aqui, há algumas coisas que eu quero salientar.

59
00:03:46,770 --> 00:03:51,870
O primeiro é que no meu terminal onde o servidor começou, havia uma pequena

60
00:03:51,870 --> 00:03:52,620
mensagem impressa.

61
00:03:52,780 --> 00:03:59,060
E o que isso nos diz é que alguém fez uma solicitação, o que é o que isso

62
00:03:59,150 --> 00:04:00,340
diz aqui para você.

63
00:04:00,630 --> 00:04:02,750
Então localhost 3000 barra.

64
00:04:02,820 --> 00:04:04,160
Então, não há nada depois.

65
00:04:04,530 --> 00:04:10,560
Nós chamamos isso do caminho da raiz ou simplesmente roteio, o que é basicamente o que queremos que nossa página inicial seja.

66
00:04:10,560 --> 00:04:15,840
Então, novamente, fui ao localhost 3000 e pressione enter.

67
00:04:16,200 --> 00:04:24,120
E isso me deu algum código, mas se eu fosse para os cães do barramento localhhh 3000 que me traz algumas coisas diferentes, se eu

68
00:04:24,120 --> 00:04:26,190
vejo a fonte da página, isso pode

69
00:04:29,760 --> 00:04:35,040
ver se nós conseguimos mais conteúdo diferente do conteúdo que recebemos pela primeira vez e Isso é

70
00:04:35,040 --> 00:04:38,430
porque esta é uma linha diferente ou uma rota diferente.

71
00:04:38,430 --> 00:04:42,670
Então, neste caso, eu não estava apenas pedindo Slash.

72
00:04:42,840 --> 00:04:44,840
Eu estava pedindo cães Slash.

73
00:04:45,210 --> 00:04:51,510
E se você olhar na saída do terminal, você pode ver que há uma diferença entre uma solicitação de solicitação para

74
00:04:51,990 --> 00:04:54,570
cortar ou obter uma solicitação para cortar cães.

75
00:04:54,570 --> 00:04:59,630
Isso está apenas me mostrando para que eu possa mostrar o que está acontecendo, mas isso não é lógica ou nada.

76
00:04:59,640 --> 00:05:03,010
É apenas uma janela para os pedidos que estão sendo feitos.

77
00:05:03,390 --> 00:05:05,330
OK, então esse é o lado do pedido das coisas.

78
00:05:05,430 --> 00:05:08,760
Quando acesse enter, faço um pedido.

79
00:05:08,760 --> 00:05:09,720
Mesma coisa aqui.

80
00:05:09,930 --> 00:05:12,430
Estou apenas fazendo isso para dois lugares diferentes.

81
00:05:12,780 --> 00:05:16,680
E é claro que eu posso fazer aqueles pedidos também com o carteiro.

82
00:05:16,680 --> 00:05:21,250
Então, vamos fazer e solicitar o localhost 3000 exatamente assim.

83
00:05:21,300 --> 00:05:25,890
Tome um momento e pense sobre o que espera que vejamos quando acesse enviar.

84
00:05:27,100 --> 00:05:34,590
Lá vamos nós acabo de obter exatamente o mesmo H-1 e se eu fizer hospedagem local 3000 cães de barraca que é

85
00:05:35,010 --> 00:05:42,240
uma solicitação de obtenção e eu envio enviar Eu recebo o mesmo correio HD que obtivemos quando fiz uma solicitação no

86
00:05:42,240 --> 00:05:43,490
navegador clicando entrar.

87
00:05:43,500 --> 00:05:47,790
Agora vamos falar sobre a lógica que faz tudo isso acontecer no lado do servidor.

88
00:05:48,110 --> 00:05:54,300
vou voltar para sublime e me concentrar nestas três partes aqui e, em particular, estes dois.

89
00:05:54,300 --> 00:05:54,940
Então eu

90
00:05:55,320 --> 00:06:00,230
Eu sei que sou um registro quebrado neste tópico, mas a sintaxe não é a parte importante.

91
00:06:00,270 --> 00:06:04,960
Nós passaremos tanto tempo em realmente escrever essas rotas que isso não é significativo.

92
00:06:05,010 --> 00:06:13,050
O que é significativo é que, neste primeiro pedaço pequeno, este código está escutando uma solicitação de solicitação para

93
00:06:13,860 --> 00:06:15,450
reduzir, então, obter barra.

94
00:06:15,720 --> 00:06:20,400
E quando isso acontece, estamos renderizando uma página chamada casa.

95
00:06:20,400 --> 00:06:27,630
Então, novamente, quando um pedido de get for feito para cortar o localhost 3000, não há mais nada, então

96
00:06:27,630 --> 00:06:29,690
vamos renderizar algo chamado de casa.

97
00:06:30,030 --> 00:06:32,660
E aqui eu tenho o arquivo chamado casa.

98
00:06:32,670 --> 00:06:34,560
Não importa o que o Ejay yess.

99
00:06:34,860 --> 00:06:38,360
E dentro dele há um H1 que diz página inicial.

100
00:06:38,430 --> 00:06:45,980
Então, vamos adicionar algo mais lá um parágrafo baixo assim e salvar.

101
00:06:46,720 --> 00:06:53,910
E agora, quando eles fazem um pedido de get apenas uma solicitação de solicitação para cortar, eu recebo o conteúdo desse arquivo para casa enviado

102
00:06:54,060 --> 00:06:58,740
de volta para mim e para que essas mudanças funcionem, eu realmente preciso reiniciar meu servidor.

103
00:06:58,800 --> 00:07:06,690
Então eu vou começar agora e assisto, vou colocar isso no lado e eu vou voltar para o Chrome, obter o meu

104
00:07:06,690 --> 00:07:07,590
servidor lá novamente.

105
00:07:08,220 --> 00:07:11,730
Eu vou fazer uma solicitação para o localhost 3000.

106
00:07:11,970 --> 00:07:16,380
Como você pode ver, me diz que uma solicitação foi feita para cortar.

107
00:07:16,830 --> 00:07:19,530
E recuperamos esse conteúdo.

108
00:07:19,590 --> 00:07:26,480
Então, novamente, nosso código aqui está ouvindo, nós recebemos solicitações e avaliamos o arquivo para enviar de volta.

109
00:07:26,490 --> 00:07:32,580
Agora, aqui está outra versão mais complicada disso, onde estamos ouvindo uma solicitação para

110
00:07:32,670 --> 00:07:33,550
cortar cães.

111
00:07:33,930 --> 00:07:36,250
E então há algum outro código que está acontecendo aqui.

112
00:07:36,390 --> 00:07:37,740
E vou ler um comentário.

113
00:07:37,740 --> 00:07:44,930
Tudo o que acontece aqui é obter todos os cães do banco de dados, então já tenho alguns em nosso banco de dados.

114
00:07:45,190 --> 00:07:54,350
E então, a próxima parte é renderizar os cachorros e nós vamos deixá-lo assim por agora.

115
00:07:54,390 --> 00:07:59,430
Então, estamos recebendo todos os cães no banco de dados e renderizando o arquivo de cães que está aqui.

116
00:07:59,710 --> 00:08:01,390
E este parece um pouco diferente.

117
00:08:01,410 --> 00:08:02,940
Não é só ele.

118
00:08:02,970 --> 00:08:05,740
Temos coisas estranhas aqui que não vimos antes.

119
00:08:06,030 --> 00:08:13,150
Mas no final do dia, o que acontece é quando eu vou para cães de barraca, nosso aplicativo está ouvindo uma solicitação

120
00:08:13,150 --> 00:08:14,230
para cortar cachorros.

121
00:08:14,340 --> 00:08:19,980
Quando obtém um, ele recupera todos os cães no banco de dados e cada um tem um nome e / ou raça

122
00:08:19,980 --> 00:08:22,330
e então faz uma pequena mentira para cada um.

123
00:08:22,470 --> 00:08:25,600
Então, cada um desses é um aliado com um nome e uma raça.

124
00:08:26,100 --> 00:08:32,640
Então, novamente, temos duas rotas cortadas como uma solicitação de busca e cortar cachorros como um pedido de get e nós recebemos

125
00:08:32,640 --> 00:08:38,740
dois arquivos diferentes e um pouco de lógica quando vamos para os cães cortados versus quando nós apenas vamos a barrajar.

126
00:08:38,880 --> 00:08:41,910
Não há lógica acontecendo que nada esteja acontecendo com o banco de dados.

127
00:08:41,910 --> 00:08:44,530
É só nos dar uma página estática.

128
00:08:44,880 --> 00:08:46,140
Mas isso não é estático.

129
00:08:46,260 --> 00:08:49,260
Isso depende do que vem do banco de dados.

130
00:08:50,160 --> 00:08:56,830
Volte para o servidor aqui para o nosso código e vou falar um pouco sobre esta linha aqui.

131
00:08:57,480 --> 00:09:02,910
Então, estamos representando uma página de um modelo chamado Dogs, que é o que está escrito aqui cães.

132
00:09:03,120 --> 00:09:13,830
Sim, mas estamos passando dados para este modelo, porque isso não tem um aliado aqui que diz resti dash mutt e não tem mais um

133
00:09:14,230 --> 00:09:20,970
depois no modelo que diz por que ele apresenta o ouro, como você pode ver, é

134
00:09:20,970 --> 00:09:23,890
isso que nós está entrando no navegador.

135
00:09:24,000 --> 00:09:26,160
Mas nosso arquivo não tem nada disso.

136
00:09:26,250 --> 00:09:27,810
E é isso que o torna dinâmico.

137
00:09:27,840 --> 00:09:32,970
Este arquivo pode ser diferente a cada vez que ele é executado dependendo do que está no banco de dados.

138
00:09:32,970 --> 00:09:39,780
Então, o que realmente fazemos é definir um modelo ou um padrão para o que queremos acontecer, o

139
00:09:39,780 --> 00:09:48,150
que é para cada coisa de cachorrinho para cada um, queremos fazer um aliado, onde vamos fazer o nome em negrito ou

140
00:09:48,300 --> 00:09:51,000
forte, a raça, assim como texto simples.

141
00:09:51,000 --> 00:09:55,800
Então, é assim que acabamos com isso para cada cachorro no banco de dados que

142
00:09:55,800 --> 00:10:02,610
recuperamos, vamos percorrer e fazer um único aliado com o nome em traço em negrito que não se encontra em negrito.

143
00:10:02,610 --> 00:10:03,780
Então, deixe-o assim.

144
00:10:03,780 --> 00:10:05,010
Vamos resumir agora.

145
00:10:05,160 --> 00:10:10,140
Então, temos o nosso código que cria o servidor aqui.

146
00:10:10,140 --> 00:10:13,820
Tudo isso é o único código responsável por fazer nosso servidor.

147
00:10:13,950 --> 00:10:16,190
Temos algum código de configuração realmente não importa.

148
00:10:16,200 --> 00:10:18,820
Alguns códigos de banco de dados também não são importantes.

149
00:10:18,840 --> 00:10:21,320
E então essas duas rotas e essas são muito importantes.

150
00:10:21,630 --> 00:10:27,240
Então, é assim que obtemos diferentes códigos e arquivos diferentes, dependendo do que você é o único que

151
00:10:27,780 --> 00:10:30,180
solicitamos, fazemos uma solicitação para cortar o pedido.

152
00:10:30,330 --> 00:10:38,040
Nós conseguimos um arquivo em casa, fazemos uma solicitação para cortar cães e um pouco mais acontece nos bastidores.

153
00:10:38,430 --> 00:10:42,720
Encontra todos os cães no banco de dados e, em seguida, torna esse arquivo de cães.

154
00:10:42,930 --> 00:10:49,170
Mas o arquivo de cães é dinâmico porque leva um monte de cachorros e para cada um deles.

155
00:10:49,170 --> 00:10:50,410
Faz um aliado.

156
00:10:50,520 --> 00:10:55,230
Então, se tivéssemos 10000 cães no banco de dados, acabaríamos com 10000 aliados.

157
00:10:55,920 --> 00:11:01,770
E o último ponto que eu quero fazer é que temos um editor de texto aqui que eu tenho um

158
00:11:01,770 --> 00:11:07,650
terminal onde estou executando o servidor e então vou no navegador e visitando essa página da web fazendo uma solicitação.

159
00:11:08,520 --> 00:11:10,370
Essas são as três ferramentas que precisamos.

160
00:11:10,410 --> 00:11:16,830
onde escrevemos o código no terminal ou em algum lugar onde possamos iniciar o servidor e tê-lo ouvido.

161
00:11:16,830 --> 00:11:19,780
Então, essas três coisas, o editor de texto

162
00:11:20,100 --> 00:11:24,420
E, finalmente, um navegador onde realmente podemos fazer pedidos.

163
00:11:24,630 --> 00:11:29,940
Portanto, não precisamos usar um navegador. Podemos usar o postar, mas ninguém usa o postar para realmente interagir com

164
00:11:29,940 --> 00:11:34,540
nossa página da Web nos próximos vídeos quando começamos a escrever nossos próprios aplicativos da web.

165
00:11:34,560 --> 00:11:36,780
Teremos essas três mesmas ferramentas.

166
00:11:36,960 --> 00:11:42,440
Então, vamos ter um editor de texto, um navegador e um terminal ou algum lugar para executar o servidor.