はじめに

Next.js ドキュメントへようこそ！

Next.js とは？

Next.js は、フルスタック Web アプリケーションを構築するための React フレームワークです。React コンポーネントを使用してユーザーインターフェースを構築し、Next.js を使用して追加機能と最適化を行います。

内部的には、Next.js はバンドル、コンパイルなど、React に必要なツールも抽象化し、自動的に設定します。これにより、設定に時間を費やす代わりに、アプリケーションの構築に集中できます。

個人開発者でも、大規模チームの一員でも、Next.js はインタラクティブでダイナミックで高速な React アプリケーションの構築に役立ちます。

主な機能

Next.js の主な機能の一部を以下に示します。

ドキュメントの使用方法

画面の左側には、ドキュメントのナビゲーションバーがあります。ドキュメントのページは、基本的なものから高度なものまで順番に整理されているため、アプリケーションを構築する際に段階的に進めることができます。ただし、任意の順番で読むことも、使用事例に該当するページにスキップすることもできます。

画面の右側には、ページ内のセクション間を簡単に移動できる目次が表示されます。ページをすばやく検索する必要がある場合は、上部の検索バーまたは検索ショートカット (Ctrl+K または Cmd+K) を使用できます。

開始するには、インストールガイドをご覧ください。

App Router と Pages Router の比較

Next.js には、App Router と Pages Router の 2 つの異なるルーターがあります。App Router は、サーバーコンポーネントやストリーミングなどの React の最新機能を使用できる新しいルーターです。Pages Router は元の Next.js ルーターで、サーバーレンダリングされた React アプリケーションを構築することを可能にし、古い Next.js アプリケーションでは引き続きサポートされています。

サイドバーの上部には、**App Router** と **Pages Router** の機能を切り替えることができるドロップダウンメニューがあります。各ディレクトリに固有の機能があるため、選択されているタブを把握することが重要です。

ページ上部のパンくずリストにも、App Router ドキュメントを表示しているか、Pages Router ドキュメントを表示しているかが示されます。

前提知識

当社のドキュメントは初心者にも分かりやすいように設計されていますが、ドキュメントをNext.jsの機能に集中させるために、基本的な知識を共有する必要があります。新しい概念を紹介する際には、関連ドキュメントへのリンクを必ず提供します。

ドキュメントを最大限に活用するには、HTML、CSS、Reactの基本的な理解が必要です。Reactのスキルを復習する必要がある場合は、React基礎コースをご覧ください。基本を学ぶことができます。その後、ダッシュボードアプリケーションの作成を通して、Next.jsについてさらに学習してください。

アクセシビリティ

スクリーンリーダーを使用してドキュメントを読む際のアクセシビリティを最適化するには、FirefoxとNVDA、またはSafariとVoiceOverを使用することをお勧めします。

コミュニティに参加する

Next.jsに関するご質問は、GitHub Discussions、Discord、X (Twitter)、およびRedditでコミュニティにお気軽にお尋ねください。