スタイリング
Next.js は、アプリケーションをスタイリングするさまざまな方法をサポートしています:
- Global CSS: 従来の CSS の経験者にとっては使いやすく馴染みやすいが、アプリケーションが大きくなると CSS バンドルが大きくなり、スタイルの管理が難しくなる可能性もあります
- CSS Modules: 名前の衝突を避け、保守性を向上させるために、ローカルにスコープされた CSS クラスを作成します
- Tailwind CSS: ユーティリティ・クラスを組み合わせることで、迅速なカスタム・デザインを可能にするユーティリティ・ファーストの CSS フレームワーク
- Sass: 変数、ネストされたルール、ミックスインなどの機能で CSS を拡張する人気の CSS プリプロセッサ
- CSS-in-JS: CSS を JavaScript コンポーネントに直接埋め込み、動的でスコープされたスタイリングを可能にします
各アプローチの詳細については、それぞれのドキュメントを参照してください。
- CSS Modules: CSS Modules を使用して Next.js アプリケーションをスタイルします。
- Tailwind CSS: Tailwind CSS を使用して Next.js アプリケーションをスタイルします。
- Sass: Next.js で CSS-in-JS ライブラリを使用する。
- CSS-in-JS: Sass を使って Next.js アプリケーションをスタイリングします。