1
00:00:01,120 --> 00:00:07,630
OK, então na última cena de vídeo, onde as outras páginas iriam viver dentro desta, pode

2
00:00:07,630 --> 00:00:09,210
parecer um pouco confuso.

3
00:00:10,250 --> 00:00:12,210
Pode não ter sido estritamente verdadeiro.

4
00:00:12,230 --> 00:00:21,980
Assim, as outras páginas não serão páginas e vamos começar definindo o corpo da nossa página.

5
00:00:22,040 --> 00:00:23,970
E isso tornaria as coisas mais claras.

6
00:00:24,020 --> 00:00:29,350
Então o corpo de um documento HDMI é o que é mostrado ao usuário.

7
00:00:29,450 --> 00:00:39,110
A cabeça é o que não é mostrado para o usuário, mas pode fazer coisas como importar arquivos estáticos, como arquivos CSSA

8
00:00:39,110 --> 00:00:39,820
ou javascript.

9
00:00:39,920 --> 00:00:47,360
Ele pode fazer coisas como definir o título de sua página e coisas como descrições e outras coisas para o Google poder indexar

10
00:00:47,360 --> 00:00:49,820
sua página corretamente e coisas do tipo.

11
00:00:50,000 --> 00:00:52,010
Então a cabeça não é mostrada ao usuário.

12
00:00:52,010 --> 00:01:03,670
O corpo é mostrado para o usuário, então para poder criar essas páginas razoavelmente fácil, nós queremos evitar ter que

13
00:01:03,670 --> 00:01:14,200
reescrever a cabeça e o rodapé, e cada página, mas nós queremos fazer, é simplesmente capaz de dizer

14
00:01:14,200 --> 00:01:21,330
que essa cabeça está indo para ser compartilhado em todas as nossas páginas.

15
00:01:21,350 --> 00:01:28,340
Por exemplo, digamos que queremos que todas as nossas páginas tenham esse título chamado blog e fantasia por exemplo

16
00:01:28,340 --> 00:01:30,160
ou qualquer título que desejarmos.

17
00:01:30,410 --> 00:01:32,900
E então nós diria que é dizer

18
00:01:35,450 --> 00:01:39,030
usando o que é chamado de linguagem de templates Jinja.

19
00:01:39,140 --> 00:01:41,900
Apenas copie o que estou fazendo agora e explicarei em um momento.

20
00:01:48,930 --> 00:01:54,080
Nós vamos dizer isso e isso não é uma quantia enorme.

21
00:01:54,210 --> 00:02:02,350
É Jinja e Jinja é uma linguagem e que é usada para simplificar a criação de H. T. am e Python

22
00:02:02,820 --> 00:02:06,610
flask usa para este propósito.

23
00:02:06,630 --> 00:02:13,890
Então o que isso faz é dizer que dentro do corpo vamos definir um bloco e esse bloco é chamado

24
00:02:13,890 --> 00:02:16,550
de conteúdo e é tudo que está fazendo.

25
00:02:17,300 --> 00:02:23,850
Está encontrando um bloco do código que iremos nesta seção.

26
00:02:24,770 --> 00:02:26,170
Depois de termos escrito.

27
00:02:26,240 --> 00:02:34,630
Então, se entrarmos em nossos modelos e criarmos um novo arquivo HD Maol, chamaremos de algo como loggin.

28
00:02:34,840 --> 00:02:37,110
Agora podemos apagar tudo isso

29
00:02:40,890 --> 00:02:51,650
e simplesmente entrar aqui e dizer que se estende nós começamos a derreter e depois dizer o conteúdo do bloco e aqui podemos escrever

30
00:02:56,530 --> 00:03:02,650
o que é que a página de logon vai mostrar aos nossos usuários.

31
00:03:02,740 --> 00:03:09,820
Por isso, seria algo como um campo para nome de usuário e um campo para senha, para que você possa ver isso se

32
00:03:09,830 --> 00:03:14,360
estende para o sidestream de outra forma simplesmente coloca o conteúdo que escrevemos aqui.

33
00:03:15,270 --> 00:03:22,460
Dentro desta página, substituindo este bloco aqui e, em seguida, se quiséssemos criar uma página de registro,

34
00:03:22,460 --> 00:03:27,440
simplesmente teríamos que copiar isso, mas com conteúdo diferente dentro deste bloco.

35
00:03:27,830 --> 00:03:33,980
Por isso, simplifica o protesto porque não precisamos mais ter tudo isso nele, simplesmente temos

36
00:03:34,220 --> 00:03:42,110
que ter qualquer conteúdo interessante para a nossa página, então vamos em frente e criar a página de login. A

37
00:03:42,110 --> 00:03:46,420
primeira coisa a fazer é definir onde o conteúdo vai viver.

38
00:03:46,430 --> 00:03:51,680
Então, se quisermos criar algo com o qual o usuário possa interagir e preencher

39
00:03:51,680 --> 00:03:59,550
alguns detalhes, precisaremos do que é chamado de um formulário, e o formulário é apenas algo que o usuário pode

40
00:03:59,550 --> 00:04:08,320
preencher, pressione o botão para enviar e, em seguida, precisamos da entrada e a entrada é algo com o qual o usuário pode

41
00:04:08,320 --> 00:04:09,920
interagir e escrever algo.

42
00:04:10,020 --> 00:04:15,360
São coisas como campos de texto ou campos de senha

43
00:04:18,950 --> 00:04:28,410
ou caixas de seleção e coisas assim e uma entrada de texto digitado é simplesmente um campo de texto.

44
00:04:28,520 --> 00:04:33,420
Não quero dizer colocar uma senha é apenas um campo de senha onde o texto

45
00:04:33,420 --> 00:04:37,540
está oculto com os pequenos pontos em vez de mostrar o texto.

46
00:04:37,580 --> 00:04:46,390
Ok, assim como o tipo de entrada, precisamos ser capazes de identificar qual deles é qual.

47
00:04:46,410 --> 00:04:51,350
Portanto, precisamos saber qual é o nome do usuário e qual é a senha para fazer isso.

48
00:04:51,390 --> 00:04:59,660
Nós vamos dar um desses campos de entrada e eu. D. um site de identificador como tudo que queremos fazer,

49
00:04:59,660 --> 00:05:01,850
em vez de usá-los, vamos usar o e-mail.

50
00:05:02,010 --> 00:05:08,480
E aqui vamos usar o Patchwerk.

51
00:05:08,620 --> 00:05:15,490
Agora, o usuário poderá ver esses dois campos de entrada quando navegar até ele no navegador.

52
00:05:15,490 --> 00:05:22,760
Agora há uma pequena advertência: esse código aqui não pode ser renderizado por um navegador.

53
00:05:22,810 --> 00:05:25,450
Então o navegador não sabe o que esse código significa.

54
00:05:25,450 --> 00:05:27,560
Python sabe o que esse código significa.

55
00:05:27,580 --> 00:05:38,360
Portanto, para que nossos usuários possam essencialmente usar esse código, não precisamos acessar esse arquivo diretamente, mas, em vez disso,

56
00:05:38,360 --> 00:05:41,890
fornecê-lo a ele com nosso código Python.

57
00:05:42,050 --> 00:05:48,230
Então nós temos que criar outro desses endpoints e nós temos que fazer o que é chamado renderizando o template.

58
00:05:48,230 --> 00:05:56,200
Se não fizermos isso e clicarmos em um desses ícones aqui, o que vemos é, mas

59
00:05:58,990 --> 00:06:02,740
temos nossos dois campos de entrada aqui.

60
00:06:02,820 --> 00:06:04,160
Este é um campo de texto.

61
00:06:04,610 --> 00:06:07,090
E isso é uma vez um campo de senha.

62
00:06:07,130 --> 00:06:14,120
Então, para poder usar esses códigos e fazer sentido, temos que renderizar o

63
00:06:14,180 --> 00:06:15,620
modelo usando Python.

64
00:06:15,650 --> 00:06:16,880
Então vamos fazer isso.

65
00:06:17,770 --> 00:06:19,100
Vá para o seu laptop.

66
00:06:19,110 --> 00:06:27,950
Por que e ao invés de retornar olá mundo aqui nós vamos retornar é o template renderizado e vamos

67
00:06:27,950 --> 00:06:37,050
ter que importar isso no template que queremos renderizar é loggin a quantidade que o flask já sabe que

68
00:06:37,050 --> 00:06:40,150
esse template mora em uma pasta template.

69
00:06:40,370 --> 00:06:49,730
OK então pressionamos o play e então podemos entrar no Crome e ver 1 2 7 4 e 5.

70
00:06:49,760 --> 00:06:52,650
E observe como esse código desapareceu agora.

71
00:06:56,290 --> 00:07:01,910
OK, então agora renderizamos o modelo de ódio da porta de logon e exibimos essas duas coisas aqui.

72
00:07:02,500 --> 00:07:04,060
Mas não há botão de envio.

73
00:07:04,180 --> 00:07:06,390
Então temos que criar isso e

74
00:07:11,700 --> 00:07:13,260
é assim que faríamos isso.

75
00:07:13,380 --> 00:07:18,190
Então, agora volte ao Chrome e atualize e que tenhamos um botão de envio lá.

76
00:07:18,330 --> 00:07:23,040
E agora, a única coisa que fizemos foi realmente criar outro tipo de entrada

77
00:07:23,040 --> 00:07:31,090
de pipe e dar a ele um identificador de algo que eu percebo que não estamos indo muito a fundo com o MLT ou

78
00:07:31,090 --> 00:07:33,280
se você acha um pouco confuso.

79
00:07:33,290 --> 00:07:33,810
Não estivessem.

80
00:07:33,810 --> 00:07:36,000
Continuaremos explorando.

81
00:07:36,010 --> 00:07:41,410
Eu realmente não quero te aborrecer com isso é como você faz todas essas coisas diferentes

82
00:07:41,680 --> 00:07:44,320
no correio, porque você não precisa delas agora.

83
00:07:44,520 --> 00:07:48,590
Mas nós precisamos deles, vamos chamá-los.

84
00:07:48,670 --> 00:07:56,510
OK, então a propósito, se formos ao Krome notar como o título é um blog chique aqui, que é

85
00:07:56,520 --> 00:07:57,690
o que definimos.

86
00:07:57,690 --> 00:08:01,120
Mas a página de logon não tem título definido.

87
00:08:01,290 --> 00:08:07,970
Na verdade, isso está se estendendo a partir da base em que a página DML está OK.

88
00:08:08,220 --> 00:08:17,030
Assim, nos próximos anos, vamos criar alguns arquivos CSSA básicos e adicioná-los à nossa página, certificando-nos de que o formulário esteja um

89
00:08:17,090 --> 00:08:22,430
pouco melhor e, em seguida, vamos nos certificar de que o formulário de login

90
00:08:22,430 --> 00:08:27,170
realmente faz alguma coisa e vamos também fazer o formulário de inscrição.

91
00:08:27,410 --> 00:08:31,790
Então, mostrarei os próximos vídeos e poderemos adicionar nossos usuários à página

92
00:08:31,790 --> 00:08:33,880
e começar a interagir com eles.

93
00:08:33,920 --> 00:08:34,700
Então te vejo lá.