Next.js Link Tag

Next.js allows us to use the <Link> tag instead of <a> to enable page navigation without sending a request to the server each time a link is clicked.

This allows the user to go to a different page instantly and without losing the data already stored in the current session.

First import Link to enable the functionality:

import Link from 'next/link';

Then use it as you would any <a> tag, but replace the "a" with "Link", keeping the href as you would to link to your destination.

<Link href='/[destination-page]/'> Text for the link to your destination </Link>