NextJSにおけるメニューコンポーネント
次のレッスンでは、サイトメニュー作成のための NextJSの特別な機能を学びます。 そのために、サイトメニューのコンポーネントが必要です。 このレッスンでは、そのコンポーネントの骨格を作成し、 リンクは次のレッスンで挿入していきます。
私たちが作成する骨格は以下のようになります:
export default function Menu() {
return <>
...
</>;
}
この骨格をサイトのメインレイアウトに挿入しましょう:
import 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>
);
}
メインメニュー用のコンポーネントを作成してください。