Metatiedot NextJS:ssä

Katsotaan nyt, kuinka lisätä sivulle otsikko ja metakuvaus. NextJS:ssä niiden kanssa työskentely tapahtuu yhdessä, ja siksi niitä kutsutaan yhteisellä termillä metatiedot.

Metatiedot asetetaan erityisellä objektilla, joka sisältää otsikon ja metakuvauksen:

app/layout.jsx{
  title: '...',
  description: '...',
};

Samalla NextJS hoitaa automaattisesti metatietojen lisäämisen vastaaviin tunnisteisiin. Meidän ei tarvitse huolehtia siitä. Siksi pääasiallisessa sivuston ulkoasussa ei ole head-tunnistetta, koska se luodaan automaattisesti:

app/layout.jsxexport default function RootLayout({children}) {
  return (
    <html lang="en">
      <body>
        {children}
      </body>
    </html>
  );
}

On olemassa erilaisia tapoja asettaa metatiedot. Opimme niistä seuraavissa oppitunneissa.