-
A navegabilidade Next js facilita
uma boa navegação entre as páginas
-
de uma forma rápida e dinâmica.
-
Para que isso aconteça
de uma forma fluída,
-
precisamos de um bom
gerenciamento de rotas.
-
No projeto precisamos criar
algumas estruturas, por exemplo,
-
criar o component "Nav.js"
-
e no "App" criar os componentes
que serão navegados.
-
Por exemplo,
a pasta "contato" recebe "page.jsx",
-
a pasta "home" recebe "page.jsx",
a pasta "sobre" recebe "page.jsx".
-
Quando o renderizador
buscar o componente
-
ele vem na pasta
e chama o componente,
-
vem na pasta chama o componente,
por isso eles tem o mesmo nome
-
e é uma boa prática utilizar "page"
-
em todas as suas pastas
como referência.
-
Lembrando que ele vai buscar também
o nome da pasta inicial,
-
aqui chama "contato",
aqui chama "home",
-
aqui chama "sobre"
e, em seguida,
-
precisamos trazer o link novamente
nosso "Nav".
-
Importar o link que é a dependência
que realiza o click
-
de chamar as páginas
e montar a estrutura.
-
Eu já coloquei a estilização
utilizando o tailwind, criei um "Nav".
-
Esse "Nav" possui uma "ul"
e aí nós temos a lista.
-
A primeira lista ele é um "home".
a segunda um sobre e a terceira o contato.
-
Se você visualizar aqui no navegador
temos o nome sobre e contato.
-
Já está estilizado de uma forma bem clara
e objetiva.
-
Em seguida, voltamos ao nosso app
-
e em cada componente,
por exemplo, o contato,
-
montamos o componente contato
e colocamos aqui o contato
-
e chamamos o componente NAV
-
para que ele receba
-
essa estrutura que toda do navegador.
-
Isso vai acontecer da mesma forma
nos outros componentes.
-
Rome e no Sobre.
-
Fazendo com que ao clicar
-
já apareça a página referente ao Rome,
-
a página referente ao Sobre
-
e a página referente ao contato.
-
Isso é um gerenciamento de rotas
que você preparou aqui no Nave
-
que o próprio Nick já criou aqui.
-
O seu gerenciamento ao criar as pastinhas
com o Page de cada uma delas
-
e assim
-
vemos como que funciona
uma navegabilidade no seu projeto.
-
Criar um gerenciamento de rotas NFS
é bem simples,
-
torna mais fácil
a aplicação em seus projetos futuros.
