10
チャプター10
アセット、メタデータ、CSS
追加した2ページ目には現在スタイルが適用されていません。ページにスタイルを適用するためにCSSを追加しましょう。
Next.jsはCSSおよびSassを組み込みでサポートしています。このコースではCSSを使用します。
このレッスンでは、Next.jsが画像のような静的アセットや、<title>タグのようなページメタデータをどのように扱うかについても説明します。
このレッスンで学ぶこと
このレッスンでは、以下を学びます。
- Next.jsに静的ファイル（画像など）を追加する方法。
- 各ページの
<head>内に含まれる要素をカスタマイズする方法。 - CSSモジュールを使用してスタイル設定された再利用可能なReactコンポーネントを作成する方法。
pages/_app.jsでグローバルCSSを追加する方法。- Next.jsでスタイリングを行うための役立つヒント。
前提条件
- 基本的なCSSの知識。このコースではNext.jsアプリにCSSを追加する方法を説明しますが、CSSの基本については扱いません。
Next.jsのスタイリングに関する詳細なドキュメントを探している場合は、CSSドキュメントをご覧ください。
この情報は役に立ちましたか？