NextJS da sayt makonidagi kontent

O'tgan darsda ko'rib chiqishni boshlagan asosiy sayt makonini ko'rib chiqamiz:

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

Ko'rib turganingizdek, sayt makoni funksiyali komponentni ifodalaydi. Bunda funktsiya parametriga obyekt uzatiladi, undan biz children kalitini mos o'zgaruvchiga ajratamiz. Ushbu o'zgaruvchida so'ralgan URLga mos keladigan page.jsx faylining mazmuni saqlanadi.

Ya'ni layout.jsx faylida bizda sayt makoni saqlanadi, children o'zgaruvchisi yordamida esa sahifa kontenti qo'yiladigan joyni ko'rsatamiz.

Misol uchun sahifa kontentini qandaydir tegga joylashtiramiz:

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