Component cho menu trong NextJS

Trong các bài học tiếp theo, chúng ta sẽ nghiên cứu các tính năng đặc biệt của NextJS để tạo menu cho website. Để làm điều đó, chúng ta sẽ cần một component chứa menu website. Trong bài học này, chúng ta sẽ tạo một bản nháp cho component đó, và sẽ chèn các liên kết trong các bài học sau.

Bản nháp của chúng ta sẽ trông như sau:

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

Hãy chèn bản nháp này vào bố cục chính của website:

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>
  );
}