はじめに

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

Next.jsとは？

Next.jsは、フルスタックのウェブアプリケーションを構築するための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は、Server ComponentsやStreamingなど、Reactの最新機能を利用できる新しいルーターです。Pages Routerは、サーバーレンダリングされたReactアプリケーションを構築できるNext.jsのオリジナルルーターであり、古いNext.jsアプリケーションでも引き続きサポートされています。

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

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

前提知識

当社のドキュメントは初心者向けに設計されていますが、Next.jsの機能に焦点を当てるためにベースラインを確立する必要があります。新しい概念を導入する際には、関連するドキュメントへのリンクを提供するようにします。

当社のドキュメントを最大限に活用するには、HTML、CSS、Reactの基本的な理解があることをお勧めします。Reactのスキルを磨く必要がある場合は、基礎を学ぶための「React Foundations Course」をご覧ください。その後、ダッシュボードアプリケーションを構築することで、Next.jsについてさらに学ぶことができます。

アクセシビリティ

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

コミュニティに参加する

Next.jsに関するご質問がある場合は、GitHub Discussions、Discord、X (Twitter)、およびRedditで、いつでもコミュニティに質問できます。