DockerでNext.jsの環境を構築してみる（Windows）
Qiitaの記事を参考・・・というかほぼそのまま実行してDockerでNext.jsの環境を作ってみました。
https://qiita.com/Keichan_15/items/4fc605895fef2a33b629
開発環境
- OS:Windows11
- Docker Desktopインストール済み
- VSCodeインストール済み
アプリケーションの定義ファイル（YAML）を作成
type nul > docker-compose.ymlエラーメッセージが表示されますが、YAMLファイルが作成されていれば問題ありません。
下記の内容でYAMLファイルを編集。
services:
app:
build:
context: .
tty: true
volumes:
- ./src:/app
environment:
- WATCHPACK_POLLING=true
command: sh -c "npm run dev"
ports:
- "3000:3000"
Dockerファイルを作成
type nul > Dockerfileエラーメッセージが表示されますが、Dockerファイルが作成されていれば問題ありません。
下記の内容でDockerファイルを編集。
FROM node:21.1.0
WORKDIR /app
アプリを作成
docker compose run --rm app sh -c 'npx create-next-app . --typescript'何回か質問がくるので、私は下記の内容で回答しています。
Ok to proceed? (y) y
✔ Which linter would you like to use? › ESLint
✔ Would you like to use React Compiler? … Yes
✔ Would you like to use Tailwind CSS? … Yes
✔ Would you like your code inside a `src/` directory? … Yes
✔ Would you like to use App Router? (recommended) … Yes
✔ Would you like to customize the import alias (`@/*` by default)? … No
Successと表示されたらOKで、srcフォルダが作成されて中にいろいろとファイルやフォルダが作成されます。
コンテナを起動
docker compose up -d
Dockerの画面でもコンテナが起動していることを確認。
環境が構築できたか確認
下記のURLを開いて、Next.jsのウェルカムページが表示されていたらOK。
http://localhost:3000/
以上になります。
お読み頂き、ありがとうございました。
