ディレクトリ移動、パッケージインストール、起動
初めに
chatGPTに質問しながらどうにか一人でNext.jsの起動までできるようになりました
以下質問内容をchatGPTにQiita風の記事にしてまとめてもらった内容になります。
本文
開発環境を整備し、Next.js のプロジェクトを作成した後の手順について詳しく解説します。今回は、新しく作成したプロジェクトのディレクトリに移動し、必要なパッケージをインストール、そして Next.js の開発サーバーを起動します。
1. プロジェクトのディレクトリに移動
まずは作成した Next.js プロジェクトのディレクトリに移動しましょう。コマンドプロンプト（またはターミナル）を開き、以下のコマンドを実行します。
cd D:\Programming\TodoApp\todo-app
これで、新しく作成したプロジェクトのディレクトリに移動することができます。
2. 必要なパッケージのインストール
プロジェクトに必要なパッケージをインストールします。ここでは例として、Material-UI (MUI) と Axios をインストールします。
まず、MUI をインストールします。MUI は React の UI フレームワークで、多数の準備済みのコンポーネントを提供しています。以下のコマンドを実行して MUI とその依存パッケージをインストールします。
npm install @mui/material @emotion/react @emotion/styled
次に、Axios をインストールします。Axios は Promise ベースの HTTP クライアントで、ブラウザと node.js の両方で動作します。以下のコマンドを実行してインストールします。
npm install axios
これで、必要なパッケージのインストールは完了です。
3. Next.js の開発サーバーの起動
最後に、開発サーバーを起動しましょう。以下のコマンドを実行します。
npm run dev
このコマンドを実行すると、http://localhost:3000 でアプリケーションが起動します。ブラウザでこの URL を開き、アプリケーションが正常に動作していることを確認しましょう。
これで、Next.js のプロジェクトの初期設定は完了です。お疲れ様でした！
以上、新しく作成した Next.js プロジェクトの初期設定について解説しました。これからの開発がスムーズに進むことを願っています！