WEBVTT

00:00:07.780 --> 00:00:11.111
Quando criamos o projeto next,
ele já vem com o modelo padrão.

00:00:11.111 --> 00:00:13.420
Precisamos personalizá-lo
para o seu uso.

00:00:13.420 --> 00:00:17.011
Eu criei o projeto em next
agora vou executá-lo

00:00:17.011 --> 00:00:19.520
e em seguida,
vamos limpar a estrutura.

00:00:19.520 --> 00:00:22.257
Essa estrutura que eu criei em next

00:00:22.257 --> 00:00:29.019
vou executá-la com o seguinte
comando: "npm run dev".

00:00:29.019 --> 00:00:32.132
Ele vai buildar,
vai gerar aqui dois links.

00:00:32.132 --> 00:00:34.920
O primeiro é local roda
na sua máquina,

00:00:34.920 --> 00:00:36.870
no seu navegador
e o segundo,

00:00:36.870 --> 00:00:40.473
caso esteja trabalhando em rede,
ele executa pela rede.

00:00:40.473 --> 00:00:44.184
Vamos usar o primeiro.

00:00:44.184 --> 00:00:47.380
E esse é um projeto next rodando.

00:00:47.380 --> 00:00:53.019
Observem que ele já vem estilizado,
personalizado, um padrão.

00:00:53.019 --> 00:00:57.690
Precisamos limpar toda essa estrutura
para começarmos o nosso projeto.

00:00:57.690 --> 00:01:00.960
Vou minimizar e começar a limpeza.

00:01:00.960 --> 00:01:05.532
Primeiro vou limpar aqui
os arquivos de imagem.

00:01:05.532 --> 00:01:09.078
Vou selecionar todos e deletar.

00:01:09.078 --> 00:01:11.404
Vamos deixar o navegador
ao lado do código

00:01:11.404 --> 00:01:14.348
para visualizar o que vai acontecendo
ao limpar a estrutura.

00:01:14.348 --> 00:01:15.541
Pronto!

00:01:15.541 --> 00:01:17.455
Apaguei as imagens do "Public",

00:01:17.455 --> 00:01:21.494
dentro do "src" vou apagar esse ícone.

00:01:21.494 --> 00:01:24.541
Vou apagar esse "global.css"

00:01:24.541 --> 00:01:29.822
e vocês vão perceber que ele
já causou alguns erros aqui.

00:01:29.822 --> 00:01:34.799
Aqui no "layout" vou tirar
o "import" do "globals.css",

00:01:34.799 --> 00:01:39.432
afinal, acabei de apagar.

00:01:39.432 --> 00:01:42.535
Ele volta e olha como vai ficando
o nosso projeto.

00:01:42.535 --> 00:01:45.071
Bem estranho.

00:01:45.071 --> 00:01:48.541
No "page" que é a página
onde aparece aqui o "Get Starter",

00:01:48.541 --> 00:01:51.049
"Save", nós vamos limpar
da seguinte maneira.

00:01:51.049 --> 00:01:59.385
Eu vou apagar tudo
o que está dentro dessa "div".

00:01:59.385 --> 00:02:05.436
Vou apagar essa estilização
deixando apenas a "div" de abertura

00:02:05.436 --> 00:02:07.293
e a "div" fechamento.

00:02:07.293 --> 00:02:09.856
Vou apagar aqui em cima o "import"

00:02:09.856 --> 00:02:17.236
e o seu projeto
está totalmente vazio na page.

00:02:17.236 --> 00:02:20.740
Continuando.

00:02:20.740 --> 00:02:30.116
No layout eu também posso apagar
os tipos de fonte.

00:02:30.116 --> 00:02:33.886
Um título,
dou o nome do projeto.

00:02:33.886 --> 00:02:38.291
Observem que ao apagar a fonte,
ele acusou um erro,

00:02:38.291 --> 00:02:41.627
porque eu estou chamando as fontes
que eu apaguei aqui.

00:02:41.627 --> 00:02:50.203
Então você remove também as fontes
que você utilizou,

00:02:50.203 --> 00:02:53.269
deixando somente essa classe.

00:02:53.269 --> 00:03:00.218
Apaga o "import"
e o projeto continua vazio.

00:03:00.218 --> 00:03:02.980
Restou apenas uma classe
a ser removida

00:03:02.980 --> 00:03:07.358
e em seguida eu vou criar
uma manipulação no arquivo page.

00:03:07.358 --> 00:03:18.564
Apagando a classe do "body"
e no page vamos criar aqui um "h1"

00:03:18.564 --> 00:03:21.020
e escrever "Fiap".

00:03:21.020 --> 00:03:25.083
Observem que já apresentou "Fiap"
sem a estilização,

00:03:25.083 --> 00:03:28.655
porque eu removi
toda a estrutura na limpeza

00:03:28.655 --> 00:03:32.451
e ficou apenas o "Fiap" limpo aqui na tela.

00:03:32.451 --> 00:03:34.875
Uma observação importante
é sempre acompanhar

00:03:34.875 --> 00:03:38.084
a documentação do next,
pois ela possui muitas atualizações.

00:03:38.084 --> 00:03:40.204
Agora você está pronto
para criar projetos em next

00:03:40.204 --> 00:03:43.031
manipulando páginas
e componentes importantes.