Vsebina v postavitvi spletnega mesta v NextJS

Oglejmo si osnovno postavitev spletnega mesta, ki smo jo začeli obravnavati v prejšnji lekciji:

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

Kot vidite, je postavitev spletnega mesta komponenta s funkcijo. Pri tem se v parameter funkcije prenese objekt, iz katerega izluščimo ključ children v ustrezno spremenljivko. V tej spremenljivki je shranjena vsebina datoteke page.jsx, ki ustreza zahtevanemu URL-ju.

To pomeni, da imamo v datoteki layout.jsx shranjena postavitev spletnega mesta, s pomočjo spremenljivke children pa označimo mesto v postavitvi spletnega mesta, kamor se mora vstaviti vsebina strani.

Za primer oblikujmo vsebino strani v kakšen tag:

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