知り合いと飲んだ勢いで、簡単なwebアプリを作ることになったので、
簡単にDockerで動くように、開発環境をいじってきましたが、
形になったので、投稿します。
(今まで投稿してきた、記事のまとめみたいな感じです)
開発環境構築
（Dockerが入ってなかったらインストールしてね)
1． クローンする
2. docker-compose upする
以上、終わり。（たぶん、動くはず...）
続きは、この開発環境についての簡単な説明を書くので、よかったら、読んでね。
docker-compose.yml
version: '3'
services:
db:
image: postgres:12
volumes:
- ./db:/var/lib/postgresql/data
ports:
- "50000:5432"
environment:
POSTGRES_DB: myapp_development
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
db_test:
image: postgres:12
volumes:
- ./db_test:/var/lib/postgresql/data
ports:
- "50001:5432"
environment:
POSTGRES_DB: myapp_test
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
api:
build: ./rails
command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
volumes:
- ./rails:/myapp
ports:
- "50003:3000"
depends_on:
- db
- db_test
view:
build: ./vuejs
command: yarn run serve
volumes:
- ./vuejs:/myapp
- /myapp/node_modules # コンテナ内のnode_nodulesがマウントで削除されないようにする
ports:
- "50004:8080"
サービスは４つで、
それぞれ、別のコンテナで動くようになっています。
- db
- 開発時に使用するデータベース
- db_text
- テスト時に使用するデータベース
- api
- RailsのAPIサーバー
- view
- フロントエンドのVue.js
データベース
docker-compose.ymlのみで、
データベースのコンテナが作成されるようにしました。
db:
image: postgres:12
volumes:
- ./db:/var/lib/postgresql/data
ports:
- "50000:5432"
environment:
POSTGRES_DB: myapp_development
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
db_test:
image: postgres:12
volumes:
- ./db_test:/var/lib/postgresql/data
ports:
- "50001:5432"
environment:
POSTGRES_DB: myapp_test
POSTGRES_USER: postgres
POSTGRES_PASSWORD: postgres
データベースの保存先は、ホストのプロジェクト直下にdb、db_testディレクトリとして、マウントされます。
/project_directory
|_ db <- ここにデータベースのディレクリが作成される
|_ db_test <- ここにデータベースのディレクリが作成される
|_ rails
|_ vuejs
|_ .gitignore
|_ docker-compose.yml
|_ README.md
APIサーバー
RailsのAPIサーバーのディレクトリは、
railsディレクトリになります。
/project_directory
|_ db
|_ db_test
|_ rails <- これ
|_ vuejs
|_ .gitignore
|_ docker-compose.yml
|_ README.md
railsディレクトリの構成は、
APIモードで作成されたプロジェクトになっています。
/rails
|_app
|_ bin
|_ config
|_ db
|_ lib
|_ log
|_ public
|_ storage
|_ test
|_ tmp
|_ vendor
|_ .gitignore
|_ .ruby-version
|_ config.ru
|_ Dockerfile
|_ Gemfile
|_ Gemfile.lock
|_ Rakefile
|_ README.md
ここのDockerfileは、
rubyのバージョンの指定と、
nodejsとpostgresql-clientのインストール、
Gemのインストールをしています。
FROM ruby:2.6.3
RUN apt-get update -qq && apt-get install -y nodejs postgresql-client
WORKDIR /myapp
COPY Gemfile /myapp/Gemfile
COPY Gemfile.lock /myapp/Gemfile.lock
RUN bundle install
database.ymlで、データベースに接続できるように設定しています。
default: &default
adapter: postgresql
encoding: unicode
pool: 5
development:
<<: *default
host: db
database: myapp_development
username: postgres
password: postgres
test:
<<: *default
host: db_test
database: myapp_test
username: postgres
password: postgres
docker-compose.ymlのapiサービスでは、
サービス実行（コンテナ起動時）にserver.pidファイルを削除して、
再起動した時のエラーが出ないようになっています。
api:
build: ./rails
command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
volumes:
- ./rails:/myapp
ports:
- "50003:3000"
depends_on:
- db
- db_test
フロントエンド
フロンドエンドのVue.jsのディレクトリ構成は、
VUE CLIのデフォルト設定で作成して、
yarnで管理するプロジェクトになっています。
vuejs
|_ public
|_ src
|_ .gitignore
|_ babel.config.js
|_ Dockerfile
|_ package.json
|_ README.md
|_ yarn.lock
ここのDockerfileは、
nodeのバージョンを指定して、
node_modulesをインストールしています。
FROM node:12.7.0-alpine
WORKDIR /myapp
COPY package.json ./
COPY yarn.lock ./
RUN yarn install
docker-compose.ymlのviewサービスでは、
開発環境なので、サービスの起動コマンドを、
yarn run serveにして、ホットリロードができるようになっています。
ホストのvuejsディレクトリをマウントする時に、
コンテナのnode_modulesをマウントで削除されないようにしています。
(サービス実行時にホスト側に空のnode_modulesができるけど気にしないでね)
view:
build: ./vuejs
command: yarn run serve
volumes:
- ./vuejs:/myapp
- /myapp/node_modules # コンテナ内のnode_nodulesがマウントで削除されないようにする
ports:
- "50004:8080"
終わり
読んでくれてありがとう〜