0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Docker ComposeでVM上にNodejsの開発(nginx-Nodejs-Mongodb)用の雛形を作成する

Posted at

Nodejsの開発用にVM/dockerを使用した環境を作成してみました。

以前こちら「dockerでVM上にnginx-Nodejs-Mongodbの開発用の雛形を作ってみた」で作成したものをDocker Composeを使用して作り直したものになります。

#環境

  • MacOS 10.12.6 (Sierra)
  • Vagrant 1.9.7

#作成される環境

  • VM:

    • centOS7
  • docker container:

    • nginx:1.13.3
    • node:7.10.1
    • mongo:3.4.7

VMのIPは192.168.33.20に設定しています。

#下準備
MacでVagrant上にdocker環境を構築する
上記手順のようにVagrantがインストールされていることが前提となります。
※VM上のDockerは新たに作成する時に入るので特に作業は必要ありません。

#ソース
こちらに一式入れてあります。
https://github.com/manjiii/Vagrant-samples/tree/master/Skeleton-nginx-nodejs-mongodb
git cloneかダウンロードで任意のディレクトリにコピーして下さい。

#環境構築

##vagrant up
Skeleton-nginx-nodejs-mongodbでvagrant upして下さい。 

cd /path/to/Skeleton-nginx-nodejs-mongodb
vagrant up
#初回はしばらく時間がかかります。

なお、vagrant-vbguest、vagrant-gatling-rsyncプラグインが必要になりますが、
入っていない場合、vagrant up時に自動でインストールするようになっています。

vagrant up終了後、ファイルの自動更新を行うためrsyncを実行して下さい。

vagrant rsync-auto

このコマンドを忘れるとファイルがlocal->vm->containerと同期されませんので注意して下さい

##動作確認

###サンプルデータ投入
vmにログインして用意してあるサンプルデータ投入用のシェルを実行します。

#vmにログイン
vagrant ssh

#vm上で操作
cd /vagrant
docker-compose exec mongodb bash /var/tmp/initialData.sh

###各コンテナの動作確認

nginx:
下記URLを開いてhello nginxページが表示される
http://192.168.33.20/

nodejs:
下記URLを開いてhello nodeページが表示される
http://192.168.33.20/app/

mongodb:
下記URLを開いて初期登録時に登録したサンプルデータ(manjiii[1-4])が表示される
http://192.168.33.20/app/mongo

ホストからmongoコマンドかmongo用のツールで
192.168.33.20:27017
につながる

#使用方法

##ディレクトリ構成

dockers配下に各containerで使用するファイルが設置されています。

Skeleton-nginx-nodejs-mongodb
├── Vagrantfile
├── docker-compose.yml
└── dockers
    ├── mongodb
    ├── nginx
    └── node
        

##nodejs
dockers/node配下に設置してあります。

node/
└── src
    ├── .foreverignore
    ├── .vscode
    │   └── launch.json
    ├── jsconfig.json
    ├── modules
    │   └── logger.js
    ├── package.json
    ├── routes
    │   ├── index.js
    │   ├── mongo.js
    │   └── router.js
    ├── server.js
    └── views
        ├── error.ejs
        ├── index.ejs
        └── mongo.ejs

初期サンプルとしてmongodbに接続する簡単なコードが入っています。
node/srcディレクトリのものがnode用のcontainer上のforeverで稼働しており、
ファイルの更新があった場合、foreverは自動で再起動し反映されます。

また、Visual Studio Coreで開発ができる設定(.vscode/launch.json)を入れてありますので、
Visual Studio Coreでローカル上の
Skeleton-nginx-nodejs-mongodb/dockers/node/srcを
開けばすぐに開発・デバッグできます。
※デバッグ方法に関しては下記を参照して下さい。
Visual Studio Codeでリモートサーバー上のNodejsをデバッグする

npm installは立ち上げ段階で行っていますが、モジュールの追加等、再度npm installを行いたい場合は
container上でnpm installを実行して下さい。

#vmにログイン
vagrant ssh

#docker-composeファイルのディレクトリに移動
cd /vagrant

#container上でnpm install実行させる
docker-compose exec node_app npm install

##nginx
dockers/nginx配下に設置してあります。

nginx
├── conf.d
│   └── default.conf
└── www
    └── index.html

wwwディレクトリ配下が静的コンテンツ用のディレクトリになります。
静的ファイルを変更したい場合はここのファイルを編集します。
編集後自動でdockerに反映されます。
また、nginxの設定を変更したい場合は
conf.d/default.conを変更し、containerをrestartして下さい。

#vmにログイン
vagrant ssh

#docker-composeファイルのディレクトリに移動
cd /vagrant

#nginxを再起動
docker-compose restart nginx

現状は/appをnodeへproxyする設定

    location /app/ {
        proxy_pass http://node_app:8080/;
    }

が入っています。

##mongodb
dockers/mongodb配下に設置してあります。

mongodb/
└── tmp
    └── initialData.sh

VM上でvolumeを利用してデータ永続化をしているため、初期データ投入用のシェルのみ配置されています。
初期データ投入用としていますが、ローカルでinitialData.shを編集し下記コマンドでmongodbに再度データを反映させることもできます。

#vmにログイン
vagrant ssh

#docker-composeファイルのディレクトリに移動
cd /vagrant

#initialData.shを実行
docker-compose exec mongodb bash /var/tmp/initialData.sh

また、VM上にポートを設定しているので
ホストからmongoコマンドかツールで
192.168.33.10:27017
で接続できます。

##ログの参照
vm上の各logディレクトリに出力されます。
※ローカルには出力されません。
各dockerディレクトリ/logで参照するか、下記コマンドで一括で参照もできます。

#vmにログイン
vagrant ssh

#ログ参照
tail -f /vagrant/dockers/*/log/*.log

#この環境について
随時更新していく予定です。
おかしいところや改善点等ありましたら教えて頂けると助かります。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?