Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lære Optimizing Navigation in Next.js | Building Pages and Layouts in Next.js
Next.js 14 Mastery for Building Modern Web Apps

bookOptimizing Navigation in Next.js

Now that we've got all the required pages, let's explore how users can move around them. Traditionally, we might employ the default HTML <a> tag. However, the issue with this approach is that it triggers a full page reload, impacting the user experience.

Next.js proposes using the <Link> component, enabling us to facilitate client-side navigation.

Back to the Project

To implement the client-side navigation, access app/ui/dashboard/nav-links.tsx, import the Link component from next/link, and substitute the <a> tag with <Link>.

Upon saving your changes, test your localhost to enable seamless page navigation without refreshing the page.

In Practice

Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 3. Kapittel 4

Spør AI

expand

Spør AI

ChatGPT

Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår

Awesome!

Completion rate improved to 2.08

bookOptimizing Navigation in Next.js

Sveip for å vise menyen

Now that we've got all the required pages, let's explore how users can move around them. Traditionally, we might employ the default HTML <a> tag. However, the issue with this approach is that it triggers a full page reload, impacting the user experience.

Next.js proposes using the <Link> component, enabling us to facilitate client-side navigation.

Back to the Project

To implement the client-side navigation, access app/ui/dashboard/nav-links.tsx, import the Link component from next/link, and substitute the <a> tag with <Link>.

Upon saving your changes, test your localhost to enable seamless page navigation without refreshing the page.

In Practice

Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 3. Kapittel 4
some-alt