-
Quando criamos um projeto Next,
ele já vem com o modelo padrão.
-
Precisamos personalizá-lo
para o seu uso.
-
Eu criei um projeto em Next,
agora vou executá-lo
-
e, em seguida,
vamos limpar a estrutura.
-
Essa é estrutura que eu criei em Next,
-
vou executá-la com o seguinte
comando: "npm run dev".
-
Ele vai buildar,
vai gerar aqui dois links.
-
O primeiro é local,
roda na sua máquina,
-
no seu navegador.
-
E o segundo,
-
caso você esteja trabalhando em rede,
ele executa pela rede.
-
Vamos usar o primeiro.
-
E esse é um projeto Next rodando.
-
Observem que ele já vem estilizado,
personalizado,
-
um padrão.
-
Precisamos limpar toda essa estrutura
para começarmos o nosso projeto.
-
Vou minimizar e começar a limpeza.
-
Primeiro, vou limpar aqui
os arquivos de imagem.
-
Vou selecionar todos e deletar.
-
Vamos deixar o navegador
ao lado do código
-
para visualizar o que vai acontecendo
ao limpar a estrutura.
-
Pronto.
-
Apaguei as imagens do "public",
-
dentro do "src" vou apagar esse ícone.
-
Vou apagar esse "global.css"
-
e vocês vão perceber que ele
já causou alguns erros aqui.
-
Aqui em "layout",
vou tirar o "import" do "globals.css",
-
afinal, acabei de apagar.
-
Ele volta e olha como vai ficando
o nosso projeto.
-
Bem estranho.
-
No "page",
-
que é a página onde aparece aqui
o "Get started", "save",
-
nós vamos limpar
da seguinte maneira.
-
Eu vou apagar tudo
o que está dentro dessa "div".
-
Vou apagar essa estilização,
-
deixando apenas a "div" de abertura
e a "div" fechamento.
-
Vou apagar aqui em cima o "import"
-
e o seu projeto
está totalmente vazio na page.
-
Continuando.
-
No layout eu também posso apagar
os tipos de fonte.
-
Em título,
dou o nome do projeto.
-
Observem que ao apagar a fonte,
ele acusou um erro,
-
porque eu estou chamando as fontes
que eu apaguei aqui.
-
Então você remove também as fontes
que você utilizou,
-
deixando somente essa classe.
-
Apaga o "import"
e o projeto continua vazio.
-
Restou apenas uma classe
a ser removida
-
e, em seguida,
-
eu vou criar uma manipulação
no arquivo page.
-
Apagando a classe do "body",
e no page,
-
vamos criar aqui um "h1"
e escrever "Fiap".
-
Observem que já apresentou "Fiap"
sem a estilização,
-
porque eu removi
toda a estrutura na limpeza
-
e ficou apenas o "Fiap" limpo
aqui na tela.
-
Uma observação importante
é sempre acompanhar
-
a documentação do Next,
pois ela possui muitas atualizações.
-
Agora você está pronto
para criar projetos em Next,
-
manipulando páginas
e componentes importantes.