NextJSにおけるメタデータ

では、ページにタイトルとメタ説明を追加する方法を見てみましょう。 NextJSでは、これらは一緒に扱われるため、 一つの総称としてメタデータと呼ばれます。

メタデータは、タイトルとメタ説明を含む 特別なオブジェクトを使用して設定します：

app/layout.jsx{
  title: '...',
  description: '...',
};

これにより、NextJSは自動的にメタデータを 対応するタグに挿入します。 私たちはこれを気にする必要はありません。 したがって、メインのサイトレイアウトには タグheadが存在しません。 なぜなら、それは自動的に生成されるからです：

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

メタデータを設定するには様々な方法があります。 これらについては、次のレッスンで学んでいきます。