Pokročilé menu v NextJS

V předchozí lekci jsme probírali problém menu z obyčejných odkazů. NextJS může tento problém vyřešit a zařídit, aby přechod po odkazu nevedl k opětovnému načtení celé stránky. Pro optimalizaci výkonu bude prostřednictvím Ajaxu načtena pouze změněná část.

K tomu místo odkazů budeme používat speciální komponentu Link. Importujeme ji:

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

Předěláme naše menu pomocí této komponenty:

/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>
  </>;
}
Задание 1

Předělejte své menu pomocí komponenty Link.

Задание 2

Přesvědčte se, že přechod po odkazech menu nyní nevede k opětovnému načtení stránky.