Up next in 10
Nesta primeira aula, você aprenderá o que é Django, como configurar seu ambiente de desenvolvimento e criar seu primeiro projeto. Ao final, você terá um servidor rodando e verá a página padrão do Django no navegador.
Website para baixar otemplate usado: https://startbootstrap.com/theme/clean-blog
Objetivos da aula:
- Entender o padrão MTV (Model-Template-View)
- Criar views básicas
- Criar templates HTML
- Configurar URLs
- Adicionar arquivos estáticos (CSS)
Pré-requisitos:
- Python instalado (versão 3.8 ou superior)
- Editor de código (recomendamos VS Code)
- Conhecimento básico de linha de comando
💡 Apoie o Canal | Faça um Pix ❤️
[email protected]
✅ 📙 Matérias de Estudo – Acesse gratuitamente todos os materiais de estudo diretamente no site.
Show More Show Less View Video Transcript
0:00
Muito bem, agora vamos começar a
0:01
trabalhar agora com o sistema de de
0:03
templates em J. Para tal isso vai ser o
0:06
seguinte, veja aqui onde eu tenho a
0:07
minha base, eu vou copiar de novo esse
0:09
mesmo código. Deixa-me só reduzir um
0:11
pouquinho para que possa aparecer
0:12
melhor. Perfeito. Eu vou copiar de novo
0:14
esse mesmo código só para que eu não
0:16
possa aperrei aqui no home e vou
0:18
deixá-lo aqui. OK? Eu não vou utilizar,
0:20
mas é só para que eu não possa perder.
0:22
Então veja, é muito importante que nós
0:25
criamos códigos reusáveis, OK?
0:28
E o jungle templates, ele tem alguns,
0:31
OK? Tem alguns blocos ou tem alguns
0:33
alguns pedaços de corte que nos permitem
0:35
que nós possamos reutilizar o nosso
0:37
cork. Então, se nós notarmos o nosso
0:39
cork HTML tem partes que são repetitivo
0:42
em um website, OK? Como como eu tinha
0:45
dito, a parte de navegação e a parte do
0:47
footer são partes que são repetitivas e
0:51
mesmo também a estrutura em si. Então
0:52
para tal, é por isso que nós temos o
0:54
base. Então aqui no base praticamente
0:56
tipo é como é como se fosse a base, OK?
0:58
Então aqui é onde nós vamos criar tipo
1:01
algo reusável, ok? Então, tudo que é
1:03
reusável,
1:05
nós vamos manter aqui na base, na base.
1:08
E essa base, por exemplo, se eu gostaria
1:10
ver no sobre, eu apenas tipo vou
1:12
estender uma, vou tipo estender uma
1:14
versão da base aqui no sobre e toda a
1:19
parte que é usável vai ficar no na base
1:22
e aqui no sobre apenas vamos tipo meter
1:25
alguns conteúdos que tem a ver apenas
1:27
com a sobre, OK? Então, para que nós
1:29
possamos entender isso melhor, vamos
1:30
aplicar isso, tá? Aqui na minha base, eu
1:32
farei o seguinte, veja, primeiramente
1:35
vamos começar a criar tipo alguns
1:36
pedaços de de código, OK? Por exemplo,
1:39
no website, normalmente essa parte aqui
1:41
do título, ele é repetível, OK? Então,
1:45
eu virei aqui no título, OK? Eu vou
1:47
fazer o seguinte, eu vou remover isso
1:50
aqui e aqui eu vou pegar tipo alguns
1:52
blocos. Então, esses blocos eles serão
1:54
da seguinte maneira. Então, aquele
1:56
assim, OK? Nós vamos abrir primeiramente
1:57
as chavetas. Control Alt. Perfeito. E
2:01
depois disso vamos usar percentagem
2:02
dessa forma aqui. Percentagem. E vamos
2:05
escrever algo do gêno que bloque
2:08
block.
2:10
Bloc dessa forma aqui. E aqui vamos dar
2:13
o nome desse mesmo bloco, por exemplo,
2:14
bloc título. Bloc título. Depois disso,
2:18
vamos fechar o nosso bloco de novo. Ok.
2:20
Vamos lá fechar isto.
2:24
Fechamos. E vai ser a mesma coisa
2:26
praticamente, OK? Quando nós abrimos um
2:29
bloco, devemos fechar esse mesmo bloco,
2:32
que não podemos deixar assim aberto.
2:34
Vamos fechar de novo esse mesmo bloco.
2:35
Agora aqui vamos dizer o seguinte, OK?
2:38
Em vez de colocarmos aqui o título, veio
2:40
aqui o título,
2:42
vai end
2:45
block. OK? Então, normalmente, nós vamos
2:47
abrir um bloco dessa forma aqui. Quando
2:50
abrimos o bloco, vamos dar o nome do
2:51
bloco. Então, aquele nome desse bloco
2:53
aqui será título. E depois vamos fechar
2:55
esse bloco. Então, aqui dentro é que nós
2:58
daremos o nome desse desse bloco aqui,
3:01
desse espaço. Então, vamos dizer meu
3:04
blog, meu blog dessa forma aqui. OK.
3:07
Bom. Então, este será o nome do nosso
3:10
blog.
3:11
Agora, se eu vier aqui e dá um refresh,
3:15
vamos sair daqui. Vamos na página
3:16
inicial, dá um refresh,
3:19
passo salvo. Ou ele ainda não está
3:21
apresentar porque nós estamos aqui na no
3:24
homem, OK? Na base, não é no homem.
3:27
Então, mas se eu ver aqui, por exemplo,
3:28
aqui na minha views, vamos lá na nossa
3:31
view. Onde é que está a minha view?
3:33
Meu qu tem aqui navios.
3:36
Se eu retornar, por exemplo, a base, OK,
3:39
base. Salvei.
3:43
Deixa-me só ver o servidor se já rodou,
3:45
tá? Processão.
3:53
Perfeito. Então, agora se eu vier aqui e
3:56
dar um refresh,
3:59
o que que ele disse? Ele disse o
4:01
seguinte, OK? Blog, meu blog, ok? Então
4:03
ele está apresente, tá? Tá dar um erro.
4:05
OK, professor é porque eu cometi algum
4:07
erro. P Qual é o erro que eu cometi?
4:11
Então o erro que eu cometi é o seguinte.
4:13
Então quando tu abres blog, OK? Veja,
4:16
nós colocamos aqui percentagem, OK?
4:18
Então essa percentagem aqui também ele
4:21
deve estar também aqui no fim. Dessa
4:23
forma ele vai entender que já temos o
4:26
blo que criamos um bloco. OK? Agora, se
4:29
eu deixar também assim dessa forma, eu
4:30
salvei, eu virei aqui, vou rodar, ele
4:34
vai me dar alguma coisa, algum erro.
4:37
Estás a ver? Template C syntax error.
4:40
Então esse erro aqui você poderá obter
4:42
bastante quando se trata de jun, ok? É
4:45
porque quando tu abres um bloco, tu um
4:49
bloco, bloco, ok? Quando tu abres um
4:51
bloco, OK? Não vou dizer em português.
4:53
Quando tu abres um bloco, tu tens que
4:55
fechar esse mesmo bloco. Ele aqui tá me
4:57
dizer o seguinte, que tá tudo que pôs?
4:59
Eu abri aqui o bloco título. Eu abri
5:02
aqui o bloco título, mas eu não fechei o
5:05
meu bloco título. Embora aqui eu tenho
5:07
aqui o end block, OK? Eu esqueci de
5:10
colocar aqui a percentagem. OK. Esse é
5:12
como eu disse, esse aqui é um erro
5:13
clássico quando se trata, quando se cria
5:15
os blocos, OK? Então eu terei que fazer
5:18
o seguinte. Agora veja, eu terei que
5:20
fechar aqui o meu blog. Vamos colocar
5:22
aqui a percentagem. Pois é muito
5:23
importante que tu escrevas essa sente.
5:26
Muito bem. OK. Agora vamos salvar e vier
5:29
aqui e rodar de novo. Vamos lá ver que
5:31
esse erro desapareceu. Estás a ver?
5:33
Agora aqui escreveu meu bloco. Então,
5:35
como eu estava dizendo, esses blocos
5:37
aqui ele permite com que nós possamos
5:40
reutilizar code. É tipo normalmente nas
5:42
partes repetitivas. Ok? Então nós aqui
5:44
estamos a criar a nossa base para o
5:46
nosso app, OK? Para o nosso template,
5:49
OK? Estamos a criar tipo a base
5:50
principal e depois vamos apenas começar
5:53
tipo reutilizar esse mesmo template.
5:56
Pronto? Vamos fazer a mesma coisa também
6:00
aqui. Ou como já salvei isso, isso aqui,
6:02
tudo isso aqui são coisas que vão ser
6:04
repetitivas, não vamos mexer. Mas onde?
6:07
Aqui start. Start bootstrap.
6:12
Esse start bootstrap. Se eu vi aqui,
6:13
vamos lá ver o que que temos. Hum, blog
6:16
limpo. Tá, essa aqui é a navegação.
6:19
Então, a navegação praticamente vamos
6:20
manter. Mas veja, tem algo também
6:23
bastante importante, OK? Pois se eu ver,
6:27
vier aqui e eu clicar, por exemplo, aqui
6:30
num sobre, ele vai me dar página não
6:33
encontrar page not found. OK? Vamos lá
6:35
voltar. Se eu clicar aqui no artigo,
6:38
mesma coisa. Page not found. O porquê?
6:40
vez. Agora nós devemos fazer também
6:42
mapeamento das nossas urls,
6:46
OK? Para que nós possamos fazer
6:47
mapeamento disso aqui, vai ser o
6:48
seguinte, OK? É quase a mesma coisa, OK?
6:51
Eu vou, deixa-me só reutilizar isso
6:53
aqui, não? Acho que vamos ver mesmo do
6:55
Z. Eu virei aqui no meu STS para me dar
6:57
um pouquinho de espaço e vamos fazer o
6:59
seguinte, OK? Vamos primeiramente abrir,
7:03
OK? Vamos abrir e fechar. Agora vamos
7:05
passar aqui as percentagem. Nunca se
7:07
esqueçam das percentagem, OK? Agora aqui
7:09
dentro vamos fazer o seguinte, OK? Eu
7:10
vou dizer o seguinte, URL
7:13
dá um pouquinho de espaço
7:16
sobre vírulas altas. Vamos dizer sobre
7:18
essas vírulas, veja, vamos fazer o
7:20
seguinte, OK? Eu vou passar o meu homem,
7:23
OK? E vou salvar. Você se lembra que
7:25
quando falamos de views de URL aqui,
7:28
esse nome que nós temos aqui, veja, esse
7:31
nome aqui, name, ele nos ajuda a
7:33
identificar o template e para
7:35
identificar o caminho. É por isso que
7:37
nós temos aqui name. Agora isso quer
7:39
dizer que se eu coloquei esse nome aqui,
7:42
aqui na minha ele, por exemplo, homem,
7:44
se eu coloquei esse nome aqui e
7:48
quando eu vier aqui e clicar nele, OK,
7:51
ele vai me levar para o homem. Se eu
7:53
clicar aqui, deixa resolver. Ele me
7:55
disse e page me levou no index. O por
7:58
que ele falhou embora por mais que eu
8:00
tenha feito veja aqui é um pouquinho
8:03
complicado o caso, ok? Então aqui em vez
8:05
de nós usamos violas aspas duplas, vamos
8:08
usar aspas simples, ok? Agora vai ter
8:11
uma luta. Meu template está em Meu
8:12
teclado está em inglês. Ah, tá aqui. Eu
8:14
vou só copiar isso aqui. Meu teclado tá
8:15
em inglês. Eu não sei onde é que está
8:16
dos símbolos. Eu vou remover esse
8:18
senhora aqui. Virei aqui. Vamos passar
8:21
aqui. Perfeito. Vou salvar agora este
8:24
index aqui. Vamos remover. Já não lhe
8:26
precisamos. Vamos manter assim início.
8:28
Saber
8:30
aqui e vamos voltar. Dá um refresh.
8:35
Perfeito. Se eu clicar aqui no início.
8:37
Pum. Estás a ver? me levou aqui no
8:39
início. Agora se eu clicar no sobre
8:40
ainda está dar eu. Vamos corrigir também
8:42
isto. Vamos lá ver. Vamos copiar tudo
8:45
isso aqui.
8:48
Veremos aqui no nosso sobre.
8:51
OK. Colamos e salvamos. Então aqui, qual
8:55
é o nome que nós demos para o sobre? O
8:57
sobre. Tá aqui o sobre. OK. Viremos para
9:00
o nosso sobre.
9:02
Vamosamos aqui. Vamos dar o nome sobre.
9:07
sobre perfeito. Como eu disse aqui, isso
9:11
que nós temos aqui, name ele nos ajuda a
9:12
identificar o template, OK? O caminho
9:15
que ele vai seguir. Então, é por isso
9:16
que nós temos, devemosar aqui o nome,
9:18
OK? Se nós vios agora aqui, vamos lá
9:21
salvar e voltar aqui.
9:25
Um refresh básico. Se eu clicar no
9:28
sobre, bum, me levou no sobre, tás a
9:30
ver? Se eu clicar no início, ele vai dar
9:33
eu. Então, já vamos tratar também disso,
9:34
OK? onde vamos fazer uma mapeamento. É
9:36
por isso que estamos a criar a nossa
9:37
base, o nosso template base. Perfeito.
9:40
Então isso aqui por enquanto não
9:42
precisamos deles, OK? Vamos fingir que
9:44
não estão aí. Ok. Perfeito. Salvamos.
9:47
Agora aqui já temos o nosso que é
9:49
básico, o navegador e o nave principal.
9:53
Agora isso aqui, esse conteúdo que tem
9:56
aqui, todo esse conteúdo sempre aqui, o
9:58
header, o contêiner, tudo isso aqui,
10:03
tirando o rodapé. OK? Tirando o rodapé.
10:06
Agora do resto que tá aí acima
10:10
coisas que têm a ver apenas com o a
10:13
página inicial do nosso blog, ok? Então,
10:16
razão pela qual que vamos fazer o
10:17
seguinte, OK? Eu vou pegar tudo isso
10:20
aqui, eu vou pegar todo ele, vou cortar,
10:23
eu virei aqui no nosso homem, OK?
10:26
Deixa-me só fechar isso. Eu virei aqui
10:28
no nosso homem, eu vou selecionar tudo e
10:30
vou deletar tudo. OK? Agora no nosso
10:32
homem eu vou colar o que eu havia
10:34
cortado. OK. Vamos manter tudo isso aqui
10:37
no nosso homem. Deixa só organizar todo
10:39
esse código.
10:43
Não, sobe, sobe, sobe. Vem até aqui.
10:46
Recua um pouquinho. Então, tudo isso
10:48
aqui ele vai ficar no nosso homem.
10:51
Um pouco. Perfeito. Então, todo esse
10:54
código aqui, ele vai estar no nosso
10:55
home. OK? Então, vamos depois eu vou
10:57
explicar o porquê. Agora vamos salvar.
11:00
Isso aqui são esses que tá aqui. O nave
11:02
eh o nave bar é um código repetitivo e o
11:05
rodap também que é tipo o footer a parte
11:07
de baixo do website são códigos
11:08
repetitivos. OK? Esses são os códigos
11:11
que vão manter apenas aqui na nossa
11:12
base. Agora eu salvei. Se eu vier aqui
11:16
de novo e dar um refresh, como podemos
11:20
ver, temos apenas isso aqui. Temos
11:21
apenas o nosso nave bar e também o nosso
11:26
rodap. E são as únicas coisas que nos
11:28
interessam, OK? Depois se eu clicar aqui
11:29
no meu sobre, ele vai me levar aqui.
11:32
Vamos voltar a mesma coisa também vamos
11:34
fazer aqui no nosso sobre. Vamos clicar
11:36
no sobre.
11:38
Vamos lá ver o que tem em comum. Tudo
11:40
isso aqui é é comum. Ok. Então aqui no
11:44
nosso sobre com essa minha eston. Então
11:45
isso quer dizer aqui esse header vai se
11:47
manter mais quem é hum conteúdo
11:50
principal. Isso também vai se manter.
11:52
Isso logo quer dizer que tudo isto aqui
11:54
deve ser deletado.
11:56
Vai ser deletado mais quem? Tudo isso
11:59
aqui para cima também vai ser deletado.
12:02
Perfeito. Então vamos recuar um
12:03
pouquinho.
12:06
OK. Já temos o nosso sobre aqui.
12:09
Perfeito. Agora, se eu vier aqui, dar um
12:12
refresh, se eu clicar no sobre, ele vai
12:14
me apresentar apenas isto, que já não
12:16
tem mais o rodapé e o nav. Perfeito.
12:20
Então, agora aqui é que vai começar
12:21
agora a mágica dos templates, realmente.
12:24
OK.
12:25
Agora no nosso home, nós viremos aqui no
12:28
nosso home e vamos fazer o seguinte, OK?
12:31
Vamos reutilizar esse cor que temos
12:34
aqui, OK?
12:37
Aqui nós vamos fazer o seguinte, nós
12:39
viremos aqui, vamos criar um blow, um
12:41
bloc, OK? Eh, deixa vou reutilizar isso
12:44
aqui.
12:46
Como eu disse, meu teclado está em
12:47
inglês. Eu não sei onde é que estão
12:49
certos símbolos. Nós viremos aqui e
12:51
vamos criar um bloco. OK, vamos criar um
12:53
bloco. Aí daí vamos remover esse senhor
12:55
aqui. Veja o jungle também. Quase que
12:58
esqueci, ele não aceita tu dares um
13:01
mesmo nome num bloco que já existe. OK.
13:04
Os nomes dos blocos devem ser
13:05
diferentes. Por exemplo, se eu manter
13:06
aqui bloco título e aqui por cima também
13:08
blo título. Vamos lá ver. Salvei isto.
13:11
Se eu vier aqui e dá um refresh, pum,
13:14
tás a ver? Template syntax error. Blog
13:17
tag with name título appears more than
13:20
one. More than once. Está dizer que blo
13:22
com esse nome aqui título está aparecer
13:24
mais de uma vez ele não permite. Ok?
13:27
Então é por isso agora aqui o nosso
13:28
bloco aqui. Esta parte aqui pramente é a
13:31
parte do conteúdo. Ok? Então nós vamos
13:32
dar o nome desse aqui como conteúdo.
13:36
Salvei.
13:38
Perfeito. Como eu já salvei, agora se eu
13:40
vier aqui, vamos dar um refresh. E bom,
13:45
já está, tá tudo funcionando. OK. Agora,
13:47
para que nós possamos reutilizar esse
13:49
código aqui, nós viremos aqui no meu
13:52
home, OK? Vamos aqui no home e vamos
13:55
dizer fazer o seguinte, OK? Para que nós
13:57
possamos reutilizar
14:00
o código aqui presente, vamos fazer o
14:03
seguinte. Veja, agora eu vou voltar na
14:05
view, vamos voltar como é que estava. Em
14:06
vez de base, ele vai me retornar o home.
14:09
OK? Pois home é o homepage mesmo. Vamos
14:13
voltar aqui e vamos ver isso aqui. Deixa
14:15
só ver se o servidor já girou. O
14:17
servidor já girou. Agora se eu vier aqui
14:20
dar um refresh, ele não vai apresentar
14:22
praticamente nada, não. Ou o que que ele
14:23
diz? Blog limpo. Blá blá blá blá blá.
14:26
Ok. Acho que lá deve ter alguma coisa.
14:30
Ah, sim, me lembro. Tem alguma, tem isso
14:32
tudo isso aqui. Perfeito. Ela agora já
14:33
tá a apresentar isto aqui. OK. É por
14:35
isso que tá aqui blog limpo, blá blá
14:36
blá, ser humano, falar qual você do
14:38
gêno. Agora aqui vamos queremos
14:41
reaproveitar esse coro que temos aqui,
14:43
né? Então isto vai ser o seguinte. Aqui
14:45
por cima nós vamos abrir de novo, vamos
14:49
criar de novo o quê? O nosso bloco, não
14:52
é? Nosso bloco. Vamos fazer o seguinte,
14:54
OK? Percentagem, percentagem. Vemos aqui
14:56
no meio e vamos fazer o seguinte, OK?
14:58
Vamos escrever extend
15:00
extend para que nós possamos
15:01
reaproveitar esse código aqui da base.
15:04
Vamos dier o seguinte: extend base, OK?
15:08
PH HTML
15:10
dessa forma aqui, sabe? Per, mas só que
15:14
esse HTML ela deve estar dentro das de
15:17
apóstrofos dessa forma aqui. OK?
15:19
Perfeito. Então, nós estamos a dizer que
15:23
tudo que estiver aqui, OK? Vamos repetir
15:26
tudo que estiver aqui para aqui dentro
15:29
do homem, OK? Para aqui dentro do homem.
15:32
OK? Pois fazendo dessa forma aqui, se eu
15:34
salvar e vier agora aqui e se eu rodar
15:38
de novo, veja, tudo isso, tudo tudo
15:40
aquilo que está no home desapareceu. Ele
15:42
agora está a apresentar tudo que está
15:44
aqui na base, OK? Então, se eu gostaria
15:47
que, se eu tenho um conteúdo aqui no
15:49
home e deve aparecer no home, se eu
15:52
gostaria que ele aparecesse, eu tenho
15:53
que vir aqui na base e ver qual dos
15:55
blocos é que eu criei aqui na base para
15:58
que eu possa também chamar esse bloco,
16:01
esse bloco que eu criei aqui e
16:04
reutilizar aquele mesmo espaço que eu
16:06
reservei, tipo, como se fosse um espaço
16:08
que eu reservei. E se eu gostaria que um
16:10
novo conteúdo aparecesse, eu vou apenas
16:11
usar aquele espaço que eu reservei aqui
16:13
na parte, OK? Então, após isto, eu vou
16:16
fazer o seguinte. Veja,
16:19
eu virei aqui. Primeira, primeiro espaço
16:21
que nós podemos reutilizar é o seguinte,
16:23
temos aqui a parte do título, OK? Bloco
16:26
título. Então, eu vou copiar isso aqui,
16:28
eu virei aqui, aqui por cima eu vou
16:31
colar e vamos dizer assim, aqui nesse
16:34
espaço aqui que eu reservei bloco
16:35
título, eu gostaria que seja página
16:38
inicial. Página inicial que página
16:42
inicial. Salvei. Se eu ver aqui, aqui tá
16:45
escrito meu blog. Se eu dar um refresh,
16:47
pum, ele trocou para a página inicial.
16:49
Aquilo é um espaço reservar que pode ser
16:50
utilizado. A mesma coisa também vamos
16:53
descer um pouquinho. Eu vou colar. Vou
16:56
até posso já ver aqui. Eu vou copiar
16:59
esse espaço aqui de conteúdo. Estás a
17:00
ver? Aquele onde tu criar o espaço,
17:03
aquela informação vai aparecer naquele
17:05
local. OK? Eu virei aqui, vou colar aqui
17:08
o conteúdo. Salvei. Eu vou pegar tudo
17:12
isso aqui, cortar. Vamos descer aqui por
17:14
baixo.
17:16
OK. Vem para cá e vou colar aqui. Se eu
17:19
salvar isto, eu virei aqui. Dá um e bum.
17:23
Tá ver? Toda toda a informação apareceu
17:25
naquele espaço reservado.
17:28
É dessa forma que nós utilizamos os
17:29
blocos, os templates é no Python Chun.
17:33
Então agora a mesma coisa também vamos
17:35
fazer no sobre, OK? Eu virei aqui.
17:42
Vamos lá ver aqui. Vamos copiar
17:43
primeiramente o título. OK. Vamos clicar
17:46
aqui no sobre. No título. Vamos colar
17:49
aqui. Se eu vier aqui, vamos clicar no
17:52
sobre. Temos apenas isso aqui. Vamos
17:54
agora trocar aqui. Vamos dizer o
17:56
seguinte, OK? Nosso sobre, vamos mudar
17:58
isso. Vamos dizer sobre mim.
18:03
Sal eu vier aqui, dar um refresh. Um
18:07
ele ficou aqui. O porquê?
18:09
Eh, blo título.
18:11
Esqueci de estender. OK. É necessário
18:13
que nós estendemos. Então, é a mesma
18:15
coisa aqui no home. OK. Vamos copiar
18:18
toda essa parte aqui
18:20
e vamos colar aqui. Estendemos a base,
18:23
OK? E aqui vamos mudar. Não vai ser
18:25
página inicial, isso vai ser sobre mim.
18:28
Sobre mim. OK. Salvei. Vamos lá ver aqui
18:32
se eu dar um refresh. Bum. Tem aqui
18:34
sobre mim. OK. Já tá para essa a parte
18:37
da base. Agora vamos meter o que tem a
18:39
ver com com
18:41
ele. Ei, havam dito para não sentir essa
18:43
palavra. OK. Desculpa aí. Agora vamos
18:46
colocar. OK. Eh, vamos copiar o nosso
18:49
bloco conteúdo. Eu virei aqui.
18:52
Vamos copiar o nosso bloco conteúdo. OK.
18:56
Eu virei aqui no sobre. Vamos dar um
18:58
pouquinho de espaço e
19:00
minimizar aqui na parte. OK. Vamos
19:03
copiar tudo isto e colar aqui. OK. Bom,
19:08
colei, salvei, enviamos agora aqui e dá
19:11
um refresh.
19:12
E bom, tudo sobre mim apareceu. Essa é a
19:16
forma como nós usamos os templates em
19:18
jungle, tá bem? Nós criamos pequenos
19:20
blocos que nos permitem nós
19:21
reutilizarmos cortes em vez de
19:23
repetirmos de novo o corte. Agora assim
19:25
o corpo ficou mais um pouquinho
19:27
minimizado. Se eu gostaria de tratar
19:29
apenas do sobre mim, eu virei aqui
19:30
apenas vou mexer aqui. Se eu gostaria de
19:32
tratar de coisas que tem a ver com home,
19:34
virei aqui dentro do conteúdo e vou
19:36
mexer apenas tudo que tem a ver com o
19:38
homem. A base é o corpo praticamente
19:41
reutilizável que será utilizado em todas
19:43
partes do nosso corpo. É por isso que
19:44
ele está separado. Então nós separamos
19:46
os cortes em pequenos pedaços para que
19:48
vai nos para que possa nos permitir nós
19:49
trabalharmos de uma forma mais
19:51
organizada e mais rápida também. Agora
19:53
para que nós possamos explicar o que é
19:54
que esse senhor aqui extende faz. Então
19:58
o extend ele praticamente herda do outro
20:01
templete. Ok? Então ele erda tudo que
20:03
estiver no template original que nós
20:05
estamos a chamar. Por exemplo, aqui nós
20:06
dissemos extendebas.html. Então isso
20:09
quer dizer que ele vai dar todo o
20:10
conteúdo, todo o conteúdo que estiver
20:12
aqui, todo que estiver aqui, ele vai
20:13
passar para homem. OK? Então dessa forma
20:15
nós podemos reutilizar os codos
20:17
presentes do do o template que nós
20:20
chamamos. OK? Estamos a agora o bloco,
20:22
esse senhor aqui, o bloco, ele define um
20:26
bloco que é substituível, que nós
20:27
podemos substituir o conteúdo presente
20:30
nele. E depois também tratamos aqui do
20:34
esse senhor aqui, onde está mesmo nosso
20:36
nave e o URL. Então o URL, praticamente
20:41
ele gera o URL através do nome, OK? do
20:44
nome que nós passamos aqui, do nome que
20:47
nós passamos aqui, do name que nós
20:48
passamos aqui. E depois
20:51
tem mais outras coisas também que vamos
20:53
tratar um pouquinho mais em frente.
20:55
Agora, se nós notarmos, ver, se nós
20:57
vermos aqui,
20:59
isso aqui está feio, certo? Não tá a
21:02
aparecer tipo da forma que tinha que
21:04
aparecer aqui. Por exemplo, aqui tá
21:06
bonito, tá tudo isso aqui. Se eu ver
21:08
aqui no home, tá todo o CSS, tá bonito,
21:12
certo? Mas se nós vemos aqui no nosso
21:14
meio que está feio, OK? Não está para
21:17
ser tipo as definições de CSS, OK? Então
21:20
é disso que vamos tratar no próximo
21:21
vídeo. Vamos aprender como é que nós
21:23
podemos usar os conteúdos táticos em
21:26
jungle, OK? Para que nós possamos
21:27
processar os códigos de eh JavaScript e
21:30
JavaScript e também os códigos CSS.
21:33
Então no próximo vídeo vamos tratar
21:34
disso. Sou João. Se gostaste do vídeo,
21:36
já sabes, dá o like no vídeo e vejo na
21:38
próxima aula. Ui,
#Jobs & Education