Docker+Express+MySQLの環境をつくる

sumi

ExpressはNode.jsのwebフレームワークです。ExpressをDockerで開発したことがなかったので、挑戦してみました。

はじめに

今回、初期ファイルを自動で生成してくれるExpress generatorを使っていますがシンプルに始めたい場合は下記のチュートリアルが分かりやすくておすすめです。

ディレクトリ構成

主なファイル（ディレクトリ）は下記3点です。

mysql・・・mysqlの設定ファイルのあるディレクトリ
src・・・express generatorで生成したファイルのあるディレクトリ
docker-compose.yml・・・複数のコンテナを組み合わせて１つのアプリケーションとして構成を定義するファイル

スクリーンショット 2020-06-06 11.25.22

docker-compose.ymlファイルを作成

公式のMySQLとNode.jsのイメージを使うのでDockerfileの作成は不要です。

version: '3'
services:
 mysql:
   image: mysql:5.7
   env_file: ./mysql/mysql.env
   environment:
     - TZ=Asia/Tokyo
   ports:
     - '3306:3306'
   volumes:
     - ./mysql/conf:/etc/mysql/conf.d/:ro
     - mysqldata:/var/lib/mysql
   networks:
     - default
 app:
   image: node:12
   env_file: ./app.env
   environment:
     - TZ=Asia/Tokyo
     - DEBUG=app:*
   tty: true
   ports:
     - '3000:3000'
   volumes:
     - ./src:/app
   working_dir: /app
   command: npm start
   networks:
     - default
   depends_on:
     - mysql
networks:
 default:
# コンテナが削除されてもデータが消えずに保持される
volumes:
 mysqldata:

mysqlのボリュームにmysqldataを定義し、最終行のボリュームにマウントすることで、コンテナが削除されてもデータが消えずに保持されます。

各コンテナの環境変数はenv_fileに指定しています。

Expressアプリケーションを作成

docker-compose.ymlファイルが書けたら、空のsrcディレクトリを作ってdockerコンテナ内に入ってexpress generatorを実行します。

コンテナ内で作業することで、自分のPCにNode.jsが入っていなくても実行できます。

# dockerを起動
docker-compose run --rm app bash
# 確認（出てきたNameをコピペ）
docker-compose ps
# コンテナに入る
docker exec -it [先程コピペしたコンテナName] bash
# expressの雛形を生成
npx express-generator
# パッケージをインストール
npm install
# コンテナから抜ける
exit

docker-compose.ymlのcommandに npm start を指定しているので、ブラウザを開いて http://localhost:3000 にアクセスするとExpressの画面が表示されていると思います。

スクリーンショット 2020-06-06 12.21.19

MySQLの設定を追加

mysqlディレクトリにmysql.envファイルを作成します。

MYSQL_ROOT_HOST=%
MYSQL_ROOT_PASSWORD=（ルートパスワード）
MYSQL_USER=（ユーザー名）
MYSQL_PASSWORD=（パスワード）
MYSQL_DATABASE=（データベース名）

次にルート（docker-compose.ymlと同じ階層）にapp.envを作成します。

MYSQL_SERVER=mysql

MySQLにログインします。

# MySQLにログイン
docker-compose exec mysql mysql -uroot -p
# envで指定したルートパスワードを入力
Enter password:
# MySQLでデータベースを確認
mysql> show databases;
mysql> use （envで指定したデータベース名）;
mysql> show tables;

これで下記のようにデータベースの確認が出来ました。（サンプルとしてsample_userというテーブルを作成したのが表示されています）

スクリーンショット 2020-06-06 13.03.21

Expressでの変更を監視したい

コードを変更したときに毎回コンテナを停止・再起動するのは大変なので、変更を検知するよう nodemon を導入したいと思います。

# appコンテナ内に入る
docker exec -it [コンテナ名] bash
# インストール
npm install -D nodemon

インストールできたらpackage.jsonのscriptsにwatchを追加します。

  "scripts": {
   "start": "node ./bin/www",
   "watch": "nodemon ./bin/www"
 },

docker-compose.ymlのcommandをwatchに修正します。

app:
　　（中略）
   command: npm run watch

これで準備はOKです。

# コンテナを起動
docker-compose up -d
# ログを表示
docker-compose logs -f

試しに src/views/index.jade に変更を加えてみてください。

extends layout
block content
 h1= title
 //- !!!!!を追加
 p Welcome to #{title} !!!!!

コンテナを再起動しなくても、ブラウザをリロードしただけで変更が反映されています。

スクリーンショット 2020-06-06 13.13.45

おわり

勉強した書籍

Dockerはこの書籍がとても丁寧にかかれていました。厚いのでサラーっと読みました。

もっと薄い本がいいなー、という方はこちらがおすすめ。

Node.js（express）はこちらの本で勉強しました。

これも良さそう👀


スキ頂けると嬉しいです〜