NextJS में मुख्य लेआउट में वेबसाइट के भाग

आइए हम अपने वेबसाइट लेआउट को देखें। इसमें currently बदलने वाली पेज सामग्री को डालने का कमांड दिया गया है:

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

हालाँकि, एक वेबसाइट पर आमतौर पर अन्य भाग भी होते हैं जो विभिन्न पृष्ठों के लिए अपरिवर्तित रहते हैं। उदाहरण के लिए, इसमें हेडर और फुटर शामिल हो सकते हैं। आइए हम उन्हें अपने लेआउट में जोड़ें:

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