NextJS'te Menü Bileşeni

Sonraki derslerde, site menüsü oluşturmak için NextJS'in özel özelliklerini inceleyeceğiz. Bunun için bir site menü bileşenine ihtiyacımız olacak. Bu derste, bu bileşenin bir taslağını hazırlayacağız, bağlantıları ise sonraki derslerde ekleyeceğiz.

Taslağımız aşağıdaki gibi görünecek:

/src/comps/menu/menu.jsxexport default function Menu() {
  return <>
    ...
  </>;
}

Bu taslağı sitenin ana şablonuna ekleyelim:

app/layout.jsximport Menu from '@/comps/menu/menu.jsx';

export default function RootLayout({children}) {
  return (
    <html lang="en">
      <body>
        <header>
          <nav>
            <Menu />
          </nav>
        </header>
        <main>
          {children}
        </main>
        <footer>
          footer
        </footer>
      </body>
    </html>
  );
}