docker-composeを使ってnginxサーバーの立ち上げ方法について紹介

こんにちは!

個人開発者の南です。

今回は、Docker Composeを使って実際にnginxのサーバーを立てて、htmlファイルを表示する方法を紹介します。

始めていた時に思っていた「DockerFileとdocker-copose.yml」や設定ファイルの記述などに関しても紹介していきますので、ぜひ最後まで読んでみて下さい。

docker-composeとは?

dockerのドキュメントによると下記のように記載されています。

Compose is a tool for defining and running multi-container Docker applications. With Compose, you use a YAML file to configure your application’s services. Then, with a single command, you create and start all the services from your configuration.
Dockerドキュメントより

訳:composeはDockerを動かすために使用されるアプリケーションを整理、動かすためのツールです。composeを使うことで、YAMLファイル形式で、Dokcerのアプリケーションのサービスを定義することができます。そして、シンプルなコマンドでYAMLファイルに定義したものを作り、起動することができます。

とあります。

早い話が、今までバラバラに管理しているファイル群をYAML形式のファイルで管理し、コマンド一発で各種サービスを立ち上げるための仕組みのことです。

DockerFileとdocker-copose.ymlの違い

僕は「docker-compose」を使った方がより、Dockerのファイルを管理しやすいというようなイメージでした。

そこで、「DockerFile」と「docker-copose.yml」の違いって何なのだろうと思っていました。

どっちか片方だけ覚えたら良いのかなと思っていました。

ただ、実際は「DockerFile」と「docker-copose.yml」ファイルの両方を覚える必要があります。

先に結論を言うと、「DockerFile」には実際のサーバー内で行う処理を記述します。

「docker-copose.yml」では、そもそも「どんなものをダウンロード(nginxかapacheかなど)するのか?」、「マウントするボリューム」は何なのか?などの概要を記載するファイルです。

これにより、1つの「DockerFile」に長々と記述するのでなく、ダウンロードするものに分けて「DockerFile」を作成して、処理を分けて記述することができるようになります。

「nginx」に関してはこの「nginx/DockerFile」を編集。

「MySQL」に関してはこの「mysql/DockerFile」を編集するといったことができるようになります。

docker-composeを使う時のフォルダの構成

docker-composeを使う時は、下記のようなフォルダ構成にするのが良さそうです。

Docker Tip #10: Project Structure with Multiple Dockerfiles and Docker Compose

というわけで下記のような構成で、htmlファイルを表示します。

実際にnginxサーバーの立ち上げ

それでは、実際にnginxサーバーを立ち上げて見ようと思います。

・.envファイルの作成
・docker-comcose.ymlの設定
・nginxの設定

.envファイルの作成

まず初めに「.envファイル」を作成します。

.envファイルとは「dokcer-compose.yml」でデフォルトで読まれる、設定変数ファイルです。

下記のような内容でファイルを記述します。

ここで記載しているものは、あとで「docker-comcose.yml」ファイルを作成する時に使用する環境変数になります。

docker-comcose.ymlの設定

「.envファイル」が作成できたら、次は「docker-comcose.yml」ファイルを作成していきます。

docker-composeの中身は下記のように記載します。

versionについて

versionについては、下記の公式サイトの中から選びます。

2019年時点では、「version:’3’」とするのが一般的かと思います。

Docker-composeの公式レファレンス

servicesについて

servicesでは、サーバー内で使用するものを設定していきます。

今回はnginxを使用するので、「nginx」を続けて記載しています。

ちなみにスペースもちゃんと開けて調整しないとコマンドを入力した時に、下記のようなエラーがでます。

「yaml.parser.ParserError: while parsing a block mapping in 」

buildについて

buildには、使用するサービスのDokcerFileが設置している場所を指定するようにしましょう。

上記では「docker-comcose.yml」と同じ階層にある「nginx」フォルダを指定しています。

volumesについて

volumesでは、ローカルのフォルダとDockerのコンテナを反映させるものをそれぞれ指定します。

「.env」の環境変数を使っていますが、環境変数を入れ替えると下記のように表示されます。

対応としては、ローカル:Dockerのコンテナ内といったように対応しています。

portsについて

portsには、ローカルのマシンとDokcerコンテナのマシンでのポートを対応させます。

「.env」の環境変数を使っていますが、環境変数を入れ替えると下記のように表示されます。

nginxの設定

docker-compose.ymlの設定ができたら、今度はnginxの設定を行っていきます。

nginxのフォルダの中身は下記のように設定しましょう。

ここでは、下記の順番で設定を行っていきます。

・nginx.confの設定
・app.test-html.confの設定
・DockerFileの設定

nginx.confの設定

まずは、nginx.confの設定を行います。

nginx.confの中身は下記のように行います。

各設定について

各設定の内容については、下記のQitaの記事にとても丁寧に纏められています。

Nginx設定のまとめ

app.test-html.confの設定

app.test-html.confの中身は下記のように記述します。

普通は「default.conf」というファイルを作成して設定するのですが、僕の場合は「default.conf」とすると、localhostで「nginx」のデフォルトのものしか表示されなしため、下記のようにしています。

上記の設定ができた「hosts」ファイルに下記の記載を加えましょう。

加えることで、docker-composeで起動した時「test-html.test」でページにアクセスできるようになります。

hostsファイルの場所はそれぞれ下記の場所にあります。

Mac:/private/etc/hosts

Windows:C:\Windows\System32\drivers\etc\hosts

各設定について

この「server」部分の各設定についても、下記のページにキレイに纏められています。

気になる方は「server」部分を見てみて下さい。

Nginx設定のまとめ

nginxのDockerFileの設定

「app.test-html.conf」の設定ができたら、今度はDokcerFileの設定を行っていきます。

DockerFileの中身は、下記のように記述しましょう。

FORMの部分で指定している「nginx」には「alpine」と「latest」を指定できます。

「alpine」を指定するとAlpine Linux。

「latest」を指定すると、デフォルトのnginxを使用するようです。

latestを指定した場合は、別のコマンドを入力する必要があると思います。。。

表示するhtmlファイルを作成

最後に実際に表示するhtmlファイルを作成しましょう。

実際のディレクトリ構成は下記のようにします。

index.htmlファイルの中身は、下記のようにしましょう。

最終的には、下記のようなフォルダ構成になると思います。

nginxの起動とhtmlファイルの表示

ここまでできたら、最後は実際に「docker-compose up」コマンドで起動してみましょう。

イメージの作成が終わったら、下記のURLにアクセスしてみます。

「test-html.test」

下記のように「Hello World!!」の文字が表示されていると思います。


この記事を書いた人

南 健太郎

1991年生まれ。関西を中心にフリーのプログラマーをしています。
今は個人開発で生活できるようになるため、日々試行錯誤中。
個人開発や日々の技術に関する情報などを発信していきます。
Twitterやってます!
良かったらフォロー、よろしくお願いします!
Twitterのリンクはこちら