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

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 4

Spørg AI

expand

Spørg AI

ChatGPT

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Awesome!

Completion rate improved to 2.08

bookOptimizing Navigation in Next.js

Stryg for at vise menuen

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

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 4
some-alt