【Docker】Nginx画像サーバーコンテナを作成する

Dockerで画像サーバーコンテナ立てたい！

という悩みを解決する記事です。

この記事を書いている私（＠Shoot58153748）は、
2020年3月現在メガベンチャーの社内スタートアップの部署で
エンジニア（1年目）をしており、

プログラミング未経験からメガベンチャーへの転職を成功させた経験・ノウハウ
Webエンジニアになってから学んだこと

をブログにまとめています。

タイトルの通り、
本記事を完璧に真似ればDockerでローカルに画像サーバーを立てることができます。

実際の業務では、
アプリ内に出てくる画像は全て画像専用のサーバーから取得していると思うので、

ローカルでも似たような環境を作れたらベターのはず！

今回の学びポイントは以下の通りです。
是非参考にしてください！

今回のポイント

Dockerコンテナの構築方法
Nginxイメージ

1 画像サーバーの仕組み
2 画像サーバー作成手順
3 まとめ

画像サーバーの仕組み
画像サーバー作成手順
まとめ

画像サーバーの仕組み

画像サーバーと呼んでいますが、
つまりはWebサーバー（リクエストに対して、レスポンスを返すサーバー）
です。

静的コンテンツに特化した用途なため「画像サーバー」と呼んでいます。

今回は「Nginx」というWebサーバーを用います。

NginxはApacheと異なり非同期で処理してくれるので、性能に優れています。

今からWebサーバーを使う（または学ぶ）なら
Nginxを使わない理由はないぐらい、Apacheの完全上位互換です。

Nginxはロードバランサーやプロキシー、Webサーバーなど他にも様々な用途があるのですが、
ここでは静的コンテンツを返す画像置き場として使います。

画像サーバー作成手順

作業の流れ

以下の順にやっていきます！

表示したい画像をディレクトリに格納
Dockerfileを作成
ビルド
ブラウザで画像にアクセス

ディレクトリ構造

表示したい画像をディレクトリに格納

mkdir -p docker/nginx-image-server/ && cd docker/nginx-image-server/
mkdir avater-image
cp ~/Downloads/webengineer-startup-risk.png ./avater-image/
vi Dockerfile

nginx-image-serverというディレクトリをプロジェクトディレクトリとし、

その下のavater-imageに表示したい画像を格納します。

（僕の場合は、先日書いたブログのアイキャッチ画像webengineer-startup-risk.pngを格納）

そして、viでDockerfileを新規作成

Dockerfileを作成

以下の内容をコピーしてそのまま保存してください

FROM nginx
RUN mkdir /usr/share/nginx/html/avater-image
COPY ./avater-image /usr/share/nginx/html/avater-image

nginxによる静的画像サーバを作りたいので、
nginxのイメージを用います。

nginxはデフォルトで/usr/share/nginx/htmlにある静的ファイルを
レスポンスで返すようになっているので、

COPYは（ローカルのディレクトリ）から（コンテナ内のディレクトリ）にコピーすることができるコマンドです。

直下にavater-imageディレクトリ（表示したい画像が格納されている）をコピーしてあげます。

これだけで完成です！

ビルド＆コンテナ起動

docker build -t avater-image-nginx .
docker run --name image-server-nginx -d -p 8080:80 avater-image-nginx

avater-image-nginxというタグを付与して、ビルド

すると先ほどのDockerfileの内容が反映されたイメージがローカルに作成されます。

あとはdocker runコマンドでコンテナを起動してあげます。
オプション指定：
-p　ポート番号を指定（8080でアクセスできるように）
-d　バックグラウンドで起動