web_bonsaiの日記

web開発の学習日記です。誰に見せるためでもないただの日記です。

ローカルでrailsのスタートページ表示までやってみる | ubuntu18.04 + docker-compose + rails5 その0002

参考にさせて頂いたページ

さくらメールボックス + gmail

docker-compose + rails5 + https

docker daemonの起動とか

dockerコマンドをsudo無しで実行する方法

sudo無しでdockerコマンドを実行できるようにする

以下のリンクは2つありますが、手順をひとつ試して上手くいかない場合には端末を再起動してみてから、もう一つの方法を試すといいかもしれません。

docker-compose をインストールする

公式ドキュメント通りやってみて上手くいかなかったら個人の記事に頼ります。

docker daemonの起動とか

docker daemonの起動とか、自動で起動する方法とかもここで押さえておくと良さそうです。

ディレクトリを作成して移動

mkdir project
cd project

docker-compose.ymlを作成

ファイルを作成します。

$ vim docker-compose.yml

自分のdocker-compose ymlの内容は下記の通りです。

version: '3'

services:
  https-portal:
    image: steveltn/https-portal:1
    ports:
      - 80:80
      - 443:443
    restart: always
    environment:
      DOMAINS: 'localhost -> http://nginx:8000'
      STAGE: local
    volumes:
      - ./https_portal/ssl_certs:/var/lib/https-portal
    depends_on:
      - nginx
  nginx:
    build: ./nginx
    ports:
      - "8000:8000"
    volumes:
      - ./nginx/nginx.conf:/etc/nginx/nginx.conf
      - ./nginx/html:/var/www/html
      - ./nginx/log:/var/log
    depends_on:
      - web
  web:
    build: ./rails
    ports:
      - "3000:3000"
    command: bundle exec rails s -p 3000 -b '0.0.0.0'
    volumes:
      - ./rails:/myapp
      - bundle:/usr/local/bundle
    environment:
      - RAILS_SERVE_STATIC_FILES=false
      - RAILS_ENV=development
volumes:
  bundle:

nginxディレクトリ作成

project ディレクトリ内に作成します。

$ mkdir nginx

nginx用のDockerfileを作成

$ vim nginx/Dockerfile

記述内容は以下の通りです。

FROM nginx:1.15.8

nginx/nginx.confを作成

$ vim nginx/nginx.conf

記述内容は以下の通りです。

user nginx;

events {
  # 1ワーカーの接続数
  # worker_connections 2048;

  # 複数のリクエストを同時に受け付けるか
  multi_accept on;

  # 複数アクセスをさばくためにI/O多重化に使うシステムコールを指定する
  use epoll;
}

http {
  # HTTPレスポンスヘッダのContent_Typeに付与する文字コード
  charset UTF-8;

  # HTTPレスポンスヘッダのServerにnginxのバージョンを入れるか(開発時以外は入れないほうが吉)
  server_tokens off;

  # upstreamのpumaを定義
  upstream puma {
    # server service名:3000; のように記述
    server web:3000;
  }

  # 
  server {
    # リスニングポート
    listen 8000;

    # ドメイン設定
    # server_name web-bonsai.com;
    server_name localhost

    # HTTPレスポンスヘッダのContent_Typeに付与する文字コード
    charset utf-8;

    # logの出力先
    access_log /var/log/nginx/access.log;
    error_log  /var/log/nginx/error.log;

    # ドキュメントルート
    root /var/www/html;

    # location
    location /index.html {
      index index.html;
    }

    # location
    location / {
      #proxy_set_header X-CSRF-Token $http_x_csrf_token;
      #proxy_set_header X-Real-IP $remote_addr;
      proxy_pass http://puma;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header Host $http_host;
      proxy_set_header X-Forwarded-Proto $scheme;
      proxy_redirect off;
    }
  }
}

nginx/htmlディレクトリを作成

$ mkdir nginx/html

nginx/html/index.htmlの作成

$ vim nginx/html/index.html

記述内容は以下の通りです。

web_bonsai index.html

nginx/log/nginxディレクトリの作成

$ mkdir nginx/log
$ mkdir nginx/log/nginx

logファイルを空で作成

$ touch nginx/log/nginx/access.log
$ touch nginx/log/nginx/error.log

railsディレクトリを作成

これもprojectディレクトリで作成します。

$ mkdir rails

rails用のDockerfileを作成

$ vim rails/Dockerfile

記述内容は以下の通りです。

FROM ruby:2.6.3
ENV LANG C.UTF-8

RUN apt-get update -qq && apt-get install -y \
    build-essential \
    nodejs \
    sqlite3 \ 
 && rm -rf /var/lib/apt/lists/*

RUN gem install bundler

WORKDIR /tmp
ADD Gemfile Gemfile
ADD Gemfile.lock Gemfile.lock
RUN bundle install

ENV APP_HOME /myapp
RUN mkdir -p $APP_HOME
WORKDIR $APP_HOME
ADD . $APP_HOME

RUN mkdir -p tmp/sockets

rails/Gemfileを作成

$ vim rails/Gemfile

記述内容は以下の通りです。

source 'https://rubygems.org'

gem 'rails', '5.1.4'

rails/Gemfile.lockを作成

空のGemfile.lockを作成します。

$ touch rails/Gemfile.lock

コマンド実行

webサービスrails newします。

docker-compose run --rm web bundle exec rails new . --force --skip-bundle

docker-compose buildします。

docker-compose build

webサービスにbundle installしてgemをインストールします。

docker-compose run --rm web bundle install

docker-compose upします。初回は少し時間がかかります。

docker-compose up

このときhttps_portalディレクトリが作成されます。

以下の表示で止まりました。

db_1  | Version: '5.7.26'  socket: '/var/run/mysqld/mysqld.sock'  port: 3306  MySQL Community Server (GPL)

ブラウザでアクセスしてみる

http://localhost:8000/ にブラウザでアクセスします。

sqlite3のエラーが表示された

以下のようなエラーが表示されていました。

Specified 'sqlite3' for database adapter, but the gem is not loaded. Add gem 'sqlite3' to your Gemfile (and ensure its version is at the minimum required by ActiveRecord).

sqlite3のエラーを解消

rails5.1.x で起こるエラーがあるようなので、以下のようにGemfileを編集し、gemのバージョンを指定します。

#gem 'sqlite3'
gem 'sqlite3', '~> 1.3.6'

以下のコマンドでもう一度bundle installします。

docker-compose run --rm web bundle install

もう一度docker-compose upする

upします。

docker-compose up

もう一度ブラウザでアクセスしてみる

もう一度http://localhost:8000/ にブラウザでアクセスします。

今度は無事railsのスタートページが表示されました。

一度止める

別タブでprojectディレクトリまで移動して、以下のコマンドで止まります。

docker-compose down

ディレクトリとファイルの所有者変更

このままだとrails newによって生成されたファイルの所有者がrootなので、以下のような感じで所有者を変更すると編集しやすいと思います。

.gitディレクトリを削除

projectディレクトリに.gitディレクトリが作成されているので削除すると良いと思います。

任意のgitリポジトリで管理する

projectディレクトリを丸ごと任意のgitリポジトリにコミットすると楽だと思います。

今後サーバーを起動するとき

以下のように-dを付けてバックグラウンドで起動するのも良いと思います。

docker-compose up -d