Dockerの導入

アプリ名の空フォルダを作成
その中にDockerfileというファイルを作成
Dockerfileの中に下記を記述

Dockerfile

FROM ruby:2.5.1

RUN apt-get update -qq && \
    apt-get install -y build-essential \ 
                      libpq-dev
#yarnのインストール
RUN apt-get update && apt-get install -y curl apt-transport-https wget && \
    curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add - && \
    echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list && \
    apt-get update && apt-get install -y yarn

#Nodejsをバージョン指定してインストール
RUN curl -sL https://deb.nodesource.com/setup_12.x | bash - && \
apt-get install nodejs

RUN mkdir /app_name 
ENV APT_KEY_DONT_WARN_ON_DANGEROUS_USAGE=DontWarn
ENV APP_ROOT /app_name 
WORKDIR $APP_ROOT

ADD ./Gemfile $APP_ROOT/Gemfile
ADD ./Gemfile.lock $APP_ROOT/Gemfile.lock

# RUN gem install bundler -v 1.3.0 (途中から追加する場合はbundlerの指定も必要)
RUN bundle install
ADD . $APP_ROOT

4.続いて、docker-compose.ymlを作成
5. 下記のような記述をする

docker-compose.yml

version: '3'
services:
  db:
    image: mysql:5.7
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: root
    ports:
      - "4306:3306"
    volumes:
      - mysql_data:/var/lib/mysql
      

  web:
    build: .
    command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
    volumes:
      - .:/app_name
      - gem_data:/usr/local/bundle
    ports:
      - "3000:3000"
    depends_on:
      - db
    tty: true
    stdin_open: true
volumes: 
  mysql_data:
  gem_data:

6.Gemfileを手動で作成（空ファイル）
7.Gemfileの中身にrailsを記述する

Gemfile

source 'https://rubygems.org'
gem 'rails', '5.2.2'

8.次にGemfile.lockを作成（空ファイル）
9.rails newをする

コマンド

docker-compose run web rails new . --force --database=mysql

10.database.ymlを編集

database.yml

default: &default
  adapter: mysql2
  encoding: utf8
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  username: root
  password: password # docker-compose.ymlのMYSQL_ROOT_PASSWORD
  host: db # docker-compose.ymlのservice名

コマンド

$ docker-compose build # コンテナをビルド

# -dオプションをつけてバックグラウンド実行するとこの後新しいシェルを立ち上げる必要がなくなる
$ docker-compose up # コンテナの一斉起動

DBの作成

$ docker-compose run web rails db:create

vue.jsのインストール

Gemfile


gem 'webpacker', github: 'rails/webpacker'

インストール

$ docker-compose run web bundle install

webpackerのインストール

 $ docker-compose run web rails webpacker:install

vue.jsのインストール

docker-compose run web rails webpacker:install:vue

vueファイルのbuild(手動）

docker-compose run web bin/webpack

自動でビルドさせる

bin/webpack-dev-server

表示させたいページに挿入


<%= javascript_pack_tag 'hello_vue' %>

docker-compose up

Dockerを学習するための記事をまとめてみました

エラーの対策も記述してます。

Running bundle update will rebuild your snapshot from scratch, using only
the gems in your Gemfile, which may resolve the conflict.
ERROR: Service 'web' failed to build: The command '/bin/sh -c bundle install' returned a non-zero code: 6

参考になる記事一覧

今回の動画ではインストール完了済みなので、この記事は飛ばしています。
DockerをMacにインストールする（更新: 2019/7/13）

今回実施する記事は下記になります。
DockerでRailsの環境構築

Mysqlの設定方法は下記が参考になります。
丁寧すぎるDocker-composeによるrails5 + MySQL on Dockerの環境構築(Docker for Mac)

下記で $ docker-compose run web bundle installの方法が記載されてました。
DockerでRailsのプロジェクトを立ち上げるまで

下記のエラーが出た場合

Running `bundle update` will rebuild your snapshot from scratch, using only
the gems in your Gemfile, which may resolve the conflict.
ERROR: Service 'web' failed to build: The command '/bin/sh -c bundle install' returned a non-zero code: 6

bundle updateを実施します

ターミナル

$ docker-compose run web bundle update

docker-composeでよく使うコマンド(Ruby on Rails)

Rails(Docker)でwebpackがインストールできない

Docker上でyarnのインストール

vue.jsの導入
 https://qiita.com/cohki0305/items/582c0f5ed0750e60c951
https://qiita.com/nagamine09/items/5bb95ef4c3714ac0a483
https://qiita.com/naoki85/items/51a8b0f2cbf949d08b11
vue.jsの理解を深める