Pokročilé menu v NextJS

V predchádzajúcej lekcii sme diskutovali problém menu z obyčajných odkazov. NextJS môže vyriešiť tento problém a spraviť to, aby prechod na odkaz neviedol k opätovnému načítaniu stránky ako celku. Pre optimalizáciu výkonu bude cez Ajax načítaná iba zmenená časť.

Na to namiesto odkazov použijeme špeciálny komponent Link. Naimportujeme ho:

/src/comps/menu/menu.jsximport Link from 'next/link';

Prepracujme naše menu pomocou tohto komponentu:

/src/comps/menu/menu.jsxexport default function Menu() {
  return <>
    <Link href="/">home</Link>
    <Link href="/about">about</Link>
    <Link href="/price">price</Link>
    <Link href="/contacts">contacts</Link>
  </>;
}