Next.jsの新規インストール手順-Part1（プロジェクトフォルダ作成）

Vercel（ヴァーセル）

2023.09.19

この記事は約2分で読めます。

Next.jsはReactアプリケーションのための人気のあるフレームワークです。以下はNext.jsのセットアップ手順の基本的なガイドです。

Node.jsのインストール

Node.jsのインストール: Next.jsを使うには、まずNode.jsとnpm（Node.jsのパッケージマネージャ）をインストールする必要があります。公式ウェブサイトからダウンロードできます。

新しいプロジェクトの作成: ターミナルを開き、次のコマンドを実行して新しいNext.jsプロジェクトを作成します。

npx create-next-app my-nextjs-app

my-nextjs-appの部分はプロジェクトの名前です。任意の名前を使用できます。

プロジェクトディレクトリに移動: 作成されたプロジェクトディレクトリに移動します。

cd my-nextjs-app

プロジェクトフォルダ内で以下のコマンドを実行して、必要な依存関係をインストールします。

npm install --save next react react-dom

プロジェクトの実行: 以下のコマンドを実行して、プロジェクトをローカルで実行します。

npm run dev

これにより、開発サーバーが起動し、ブラウザで http://localhost:3000 にアクセスするとアプリケーションが表示されるはずです。

もし、これらの手順を試しても問題が解決しない場合は、プロジェクトのフォルダ構造やファイル内容に誤りがないか、特に package.json ファイルの内容を確認してみてください。

以上の手順で、開発サーバーが起動し、ブラウザで http://localhost:3000 にアクセスするとアプリケーションが表示されるはずです。

つづく。