【Dockerfile】Next.js のコンテナを作成する

はじめに

この記事では、Dockerfile からビルドしたイメージを元に Next.js のコンテナを作成する手順について記載します。

開発環境

開発環境は以下の通りです。

• Windows11
• Docker Engine 26.1.1
• Node.js 20.17.0
• npm 10.8.2
• Next.js 14.2.8
• React 18

Next.js アプリケーションの作成

まずは Next.js アプリケーションを作成します。

npx create-next-app@latest

インストール中の質問は、以下のように回答します。

ローカルサーバーを起動します。

cd next
npm run dev

初期画面が表示されます。

Dockerfile の作成

Dockerfile を作成します。

FROM node:20-alpine

WORKDIR /app

COPY . .

RUN npm install
RUN npm run build

CMD ["npm", "start"]

イメージのビルド

作成した Dockerfile からイメージをビルドします。

docker image build --tag next-image:0.0.1 .

イメージがビルドできたか確認します。

docker image ls next-image

コンテナの起動

ビルドしたイメージからコンテナを起動します。

docker container run `
--name app           `
--rm                 `
--publish 3000:3000  `
next-image:0.0.1

http://localhost:3000 にアクセスすると、先ほどと同じ初期画面が表示されます。

関連