CKA フルコース 1 日の ULTI ステージ Docker ビルド

このブログ投稿では、Docker について詳しく説明し、シンプルな Nginx アプリケーションを使用してマルチステージ Docker ビルドを作成する手順を説明します。 Docker を使い始めたばかりの場合でも、心配しないでください。すべてを段階的に説明していきますので、理解していただけます!

Dockerfile

これが作業する Dockerfile です:

FROM node:18-alpine AS installer

WORKDIR /app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

FROM nginx:latest AS deployer

COPY --from=installer /app/build /usr/share/nginx/html

Dockerfileの解凍

それでは、この Dockerfile で何が起こっているのかを段階的に見ていきましょう:

1. ノードから:18-alpine AS インストーラー

この行は、Docker Hub から公式の Node.js イメージ (Alpine Linux のバージョン 18) をプルします。 Docker Hub はイメージのライブラリと考えてください。この行を使用して、ビルドの最初の段階のベース イメージとして Node.js を使用することを指定します。

2. WORKDIR /app

このコマンドは、コンテナ内の作業ディレクトリを /app に設定します。これは、デスクトップ上でファイルを整理するのと同じように、コンテナ内にアプリケーション専用のフォルダーを作成すると考えることができます。

3. パッケージ*.json ./をコピーします

ここでは、package.json ファイルと package-lock.json ファイルをローカル ディレクトリからコンテナの作業ディレクトリにコピーします。これらのファイルには、アプリケーションに必要な依存関係に関する情報が含まれています。

4. npm install を実行します

このコマンドは npm install を実行し、package.json で指定されたすべての依存関係をインストールします。

5. コピーします。 .

この行は、残りのアプリケーション ファイルをコンテナーにコピーします。これにより、ローカル ディレクトリのすべてがコンテナ内の /app ディレクトリに取り込まれます。

6. npm run build を実行します

ここで、npm run build コマンドを使用してアプリケーションをコンパイルします。通常、このステップではコード (この場合は React が多い) を静的バンドルに変換し、ユーザーに提供できるようにします。このコマンドの出力は、/app.

内のビルド ディレクトリに配置されます。

7. nginx:最新の AS デプロイヤーから

この行では、新しいベースイメージ Nginx に切り替えます。 Nginx は、先ほど構築したような静的ファイルを提供できる強力な Web サーバーです。これは、複数段階のビルド プロセスの第 2 段階の始まりです。

8. コピー --from=installer /app/build /usr/share/nginx/html

ここでは、前の段階 (インストーラー) から構築されたアプリケーション ファイルを Nginx 提供ディレクトリにコピーします。 --from=installer フラグは、定義したばかりのインストーラー ステージからファイルを取得するように Docker に指示します。

Dockerコンテナの実行

Dockerfile を設定したら、次のコマンドを使用して Docker コンテナを構築して実行できます。

FROM node:18-alpine AS installer

WORKDIR /app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

FROM nginx:latest AS deployer

COPY --from=installer /app/build /usr/share/nginx/html

your-app-name は、選択した名前に必ず置き換えてください。 -dp フラグはコンテナを切り離し、ホスト マシンのポート 3000 をコンテナのポート 80 にマップし、http://localhost:3000 でアプリにアクセスできるようにします。

結論

そして、これで完成です！ Nginx を使用してアプリケーションを開発から本番環境に移行するマルチステージ Docker ビルドを作成しました。このプロセスについてご質問やご意見がございましたら、お気軽に以下にコメントを残してください!

注意事項: 注意すべきこと

この設定で作業するときによくある問題の 1 つは、正しいポート番号をマッピングするのを忘れることです。 Nginx は通常、コンテナ内のポート 80 でリッスンしますが、ローカル マシン上のアプリにアクセスしようとしている場合は、コンテナからマシンに正しいポートを転送する必要があります。たとえば、localhost:3000 上のアプリにアクセスしたい場合は、フラグ -p 3000:80 を指定してコンテナを実行し、マシン上のポート 3000 をコンテナ内のポート 80 にマップする必要があります。

このステップを怠ると、すべてが完璧に構築されているのに、なぜブラウザでアプリにアクセスできないのか不思議に思うことになります。

---

タグとメンション

@piyushsachdeva
3 日目のビデオ

以上がCKA フルコース 1 日の ULTI ステージ Docker ビルドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。