← ハンズオン一覧に戻る

Container Hands-on / Docker Basics

自分で書いたDockerfileから、
イメージを作る

前のステップでは既製のイメージをそのまま使いましたが、今回は自分用のWebページを組み込んだイメージを、Dockerfileという「設計図」を書いて作成します。ビルドしたイメージからコンテナを起動し、内容が反映されていることを確認します。

● Lv.2 基本的なリソースを作れる人 ⏱ 所要 30〜50 分 ローカルのDocker操作のみ（AWS未使用）
01 — Prerequisites

はじめる前に

  • 必須Docker Desktopをインストール・起動できること
  • 必須docker pull・docker runなど基本コマンドの実行経験
  • 必須テキストエディタでファイルを作成・編集できること
  • あると良いフォルダ階層（どのフォルダに何のファイルがあるか）のイメージができる

※ このハンズオンは AWSのリソースを一切使いません。お使いのパソコンの中だけで完結します。

02 — References

参照する公式ドキュメント

手順に迷ったときや、用語の意味を確かめたいときに開きましょう。

Writing a Dockerfile ↗ Dockerfileの基本的な書き方についての説明です。 docs.docker.com/get-started/docker-concepts/building-images/writing-a-dockerfile/ Dockerfile reference ↗ FROM・COPYなど、Dockerfileで使える命令の一覧と詳細です。 docs.docker.com/reference/dockerfile/ docker build コマンドリファレンス ↗ Dockerfileからイメージをビルドする docker build コマンドについての説明です。 docs.docker.com/reference/cli/docker/buildx/build/

※ Docker社の公式ドキュメント（英語）です。リンク切れの場合は、ページタイトルで検索してください。

03 — Background

背景・シナリオ

公開されているイメージをそのまま使うだけでは、自分のアプリケーションを動かすことはできません。実際の開発では、「何をベースにして、どんなファイルを追加し、どう動かすか」を自分で定義する必要があります。これを記述したものがDockerfileです。

今回は、Web サーバーの公開イメージ（nginx）をベースに、自分で書いたHTMLファイルを組み込んだDockerfileを作成し、そこから自分専用のイメージをビルドします。ビルドしたイメージからコンテナを起動し、既定のページではなく自分のページが表示されることを確認します。

DockerfileのFROM行は何をしているの？

FROM は、土台として使う既存のイメージを指定する命令です。今回はnginxの公式イメージを土台にし、ゼロからWebサーバーの仕組みを作り直すことはしません。

COPYは何をしているの？

COPY は、ローカルのファイルをイメージの中の指定した場所にコピーする命令です。今回は、自分で書いたHTMLファイルを、nginxが既定で表示する場所にコピーします。

Goal

自分で書いたDockerfileから、HTMLファイルを組み込んだ独自のイメージをビルドする。そのイメージからコンテナを起動し、ブラウザで自分の書いた内容が表示されることを確認する。

04 — Flow

つくる流れ

「設計図を書く」→「イメージにする」→「起動して確かめる」という流れを体験します。

📝 Dockerfile 設計図を書く
→
🏗️ docker build イメージを作成
→
▶️ docker run コンテナを起動
→
🌐 ブラウザ 内容を確認
05 — Requirements

要件

以下の要件を満たし、Dockerfileからのイメージビルドを体験してください。

No要件
1適当なフォルダに、簡単な内容のHTMLファイル（index.html）を1つ作成する。
2同じフォルダに、nginxをベースにしてこのHTMLファイルを組み込む Dockerfile を作成する。
3docker build で、作成したDockerfileから任意のタグ名を付けてイメージをビルドする。
4ビルドしたイメージからコンテナを起動し、ブラウザでアクセスして自分で書いたHTMLの内容が表示されることを確認する。
5docker images でビルドしたイメージが一覧に表示されていることを確認し、不要なコンテナ・イメージを削除する。
06 — Steps

構築の進め方

「素材を準備する」→「イメージをビルドする」→「起動して確認する」→「後片付けする」という順番で進めます。

  1. フェーズ1 — 素材を準備する

  2. 作業用フォルダとHTMLファイルを作成する

    適当な名前のフォルダを作成し（例：my-custom-image）、その中に index.html を作成します。内容は自由ですが、後で確認しやすいよう、自分が書いたと分かる文言を入れておきましょう。

    <!DOCTYPE html>
<html>
<head><title>My Custom Page</title></head>
<body>
  <h1>これは自分で作ったイメージのページです</h1>
</body>
</html>

  3. Dockerfileを作成する

    同じフォルダに、拡張子のないファイル名 Dockerfile を作成し、次の内容を書きます。

    # 土台にするイメージ
FROM nginx:latest

# HTMLファイルを、nginxが既定で表示する場所にコピーする
COPY index.html /usr/share/nginx/html/index.html
    フォルダ構成を確認する

    この時点で、フォルダの中に index.html と Dockerfile の2つのファイルが並んでいる状態になっているはずです。

  4. フェーズ2 — イメージをビルドする

  5. docker buildでイメージを作成する

    ターミナルで作業用フォルダに移動し、次のコマンドを実行します。

    docker build -t my-custom-nginx:1.0 .

    末尾の . は「今いるフォルダを材料として使う」という意味です。実行後、ビルドが成功したことを示す表示が出ることを確認します。

  6. フェーズ3 — 起動して確認する

  7. ビルドしたイメージからコンテナを起動する

    docker run --name my-custom-site -d -p 8080:80 my-custom-nginx:1.0

    ブラウザで http://localhost:8080 を開き、nginxの既定ページではなく、自分で書いたHTMLの内容が表示されることを確認します。

    これがゴール

    自分で書いた設計図（Dockerfile）どおりに、自分だけのページが表示されている——この状態を確認できたら、このハンズオンの目的は達成です。

  8. フェーズ4 — 後片付けする

  9. イメージの一覧を確認し、不要なものを削除する

    docker images
docker stop my-custom-site
docker rm my-custom-site

    docker images の一覧に、my-custom-nginx というタグ名のイメージが表示されていることを確認します。

07 — Pitfalls

つまずきポイント

初学者がよく引っかかる箇所を先回りでまとめました。答えそのものは載せていませんが、「どこを見直すか」の手がかりとして使ってください。

Pitfall 01 — ビルドが失敗する

「docker buildを実行すると、ファイルが見つからないというエラーが出る」

Dockerfileとindex.htmlが同じフォルダにあるか、docker buildを実行しているフォルダ（カレントディレクトリ）が正しいかを見直しましょう。

Pitfall 02 — 古い内容のままに見える

「Dockerfileを直して再ビルドしたのに、ブラウザの表示が変わらない」

同じタグ名で再ビルドした場合、すでに起動しているコンテナは古いイメージのまま動き続けています。コンテナを一度削除してから、新しいイメージで起動し直しているかを見直しましょう。

08 — Checklist

完了チェック

要件の再確認ではなく、画面・ターミナルのどこを見れば達成を確認できるかをまとめました。次を順に確かめましょう。

  • docker build の実行ログの最後に、ビルド成功を示す表示が出ている。
  • docker images の一覧に、指定したタグ名のイメージが表示されている。
  • ブラウザでアクセスすると、nginxの既定ページではなく、自分で書いた内容が表示される。
  • 不要なコンテナ・イメージを削除した後、それぞれの一覧から消えている。
09 — Think

考えてみよう

手を動かすことに加えて、次の問いに自分の言葉で答えられるようにしておくと、理解がより深まります。

  1. なぜゼロからWebサーバーを作らず、既存のnginxイメージを土台（FROM）にしたのでしょうか。
    ヒント
    すでに用意されている機能を再利用することで、自分が書く部分がどれだけ少なく済むか考えてみましょう。
  2. 同じDockerfileから内容を変えて何度もビルドし直す場合、タグ名はどのように管理するとよいでしょうか。
    ヒント
    毎回同じタグ名を使う場合と、バージョン番号を変えていく場合で、後から見たときの分かりやすさがどう変わるか考えてみましょう。
  3. このカスタムイメージを、別のパソコンや、将来的にAWSのコンテナサービスで動かしたい場合、次に何が必要になりそうでしょうか。
    ヒント
    今はこのパソコンの中にしかないイメージを、他の場所からも使えるようにするには、どこかに「保管・共有」する場所が必要になります（このハンズオンでは扱っていない発展的な内容です）。
10 — Clean up

後片づけ

本編の中で削除し忘れたものがあれば、ここで確認します。

  1. コンテナを削除する：本編のフェーズ4で削除済みの場合は不要です。docker ps -a で残っていないか確認してください。
  2. イメージを削除する：今後使わない場合は、docker rmi my-custom-nginx:1.0 でビルドしたイメージを削除できます。
  3. ローカルのファイルを削除する：作業用フォルダが不要であれば削除します。

コストに関する注意: このハンズオンではAWSのリソースを作成していないため、料金はかかりません。Docker Desktopは個人利用や小規模なチームでの利用では無料ですが、一定規模以上の組織での利用には別途ライセンスが必要になる場合があります。組織で利用する場合は、Docker社の利用規約を確認してください。