Docker-Composeを使ったRails7の開発環境構築手順を説明します。
意外にもDocker構築を含めた一筆書きのRails7セットアップ手順が見受けられなかったので自分で試行錯誤しながら記事にしました。極力シンプルな手順を心がけています。誰かの参考になれば幸いです。
環境情報
MacBook Pro
Rails 7.0.4
Ruby 3.1.2
Postgresql 13.6
Docker 20.10.12
docker-compose 1.29.2
node.js 18.9.1
bootstrap 5.2.1
設定ファイルの準備
プロジェクトフォルダの作成
プロジェクトのフォルダを作成して、カレントディレクトリを移動しておきます。
空のGemfile.lock yarn.lockの空ファイルも事前に作成しておきます。
mkdir my_app
cd my_app
touch Gemfile.lock
touch yarn.lock
※ 「my_app」と記述されている箇所はご自身のアプリ名に置き換えてください。
Docker設定ファイル
RubyとNode.jsイメージを使用してDockerfileを作成します。
RubyのイメージにデフォルトでインストールされているNode.jsのバージョンををNode.jsイメージのバージョンに置き換えて構築します。
Dockerfile
FROM node:18.9 .1 as node
FROM ruby:3.1 .2
ENV TZ Asia /Tokyo
WORKDIR / my_app
COPY entrypoint . sh /us r/bin/
RUN chmod +x / usr / bin/entrypoint.sh
ENTRYPOINT [" entrypoint.sh " ]
COPY --from=node / usr / local/bin/node / usr / local/bin/node
COPY --from=node / usr / local/include /node / usr / local/include /node
COPY --from=node / usr / local/lib/node_modules / usr / local/lib/node_modules
RUN ln -s / usr / local/bin/node / usr / local/bin/nodejs && \
ln -s / usr / local/lib/node_modules/npm/bin/npm-cli.js / usr / local/bin/npm
RUN apt-get update -qq && apt-get install -y postgresql-client
RUN npm install yarn -g -y
COPY Gemfile Gemfile
COPY Gemfile .lock Gemfile .lock
RUN gem update --system && bundle install
COPY package.json yarn.lock ./
RUN yarn install
COPY . ./
EXPOSE 3000
CMD [" rails " , " server " , " -b " , " 0.0.0.0 " ]
続いて、docker-compose.ymlを作成します。webサーバーとdbサーバーの定義を記述します。
docker-compose.yml
version : "3.9"
services :
web :
build : .
command : bash -c "rm -f tmp/pids/server.pid && bin/dev"
tty : true
stdin_open : true
ports :
- "3000:3000"
volumes :
- .:/my_app:delegated
- bundle:/usr/local/bundle
depends_on :
- db
db :
image : postgres:13.6
volumes :
- postgres:/var/lib/postgresql/data
ports :
- "5432:5432"
environment :
POSTGRES_USER : my_app
POSTGRES_PASSWORD : password
POSTGRES_DB : my_app_development
TZ : "Asia/Tokyo"
POSTGRES_INITDB_ARGS : "--encoding=UTF-8 --locale=C"
volumes :
bundle :
postgres :
Rails用のファイルの作成
Gemfileを作成します。Rails7以上を使用するという記述します。
Gemfile
source ' https://rubygems.org '
gem ' rails ' , ' ~> 7.0.0 '
下記の内容でentrypoint.shを作成します。これはRails特有の問題を防ぐために使用されるスクリプトです。
サーバー内にserver.pidというファイルが先に存在していたときに、サーバーが再起動できなくなる問題を回避するために使用されます。
entrypoint.sh
set -e
rm -f /my_app/tmp/pids/server.pid
exec " $@ "
package.json
空のjsonオブジェクトを定義しておきます
{}
ファイル構成の確認
上記を踏まえるとファイル構成は以下の通りになります。
my_app
Dockerfile
docker-compose.yml
entrypoint.sh
Gemfile
Gemfile.lock
package.json
yarn.lock
環境構築
docker-compose build
docker-compose buildコマンドを使用してDocker環境を構築します。
docker-compose build --no-cache
rails new
続いてカレントディレクトリに対してrails newコマンドでファイルを展開します。
docker-compose run web rails new . --force --no-deps --database=postgresql --css=bootstrap --javascript=esbuild
rails newが完了するとターミナル上に以下のメッセージが表示されますのでpackage.jsonに追記します。
Add " scripts " : { " build " : " esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=assets " } to your package.json
Add " scripts " : { " build:css " : " sass ./app/assets/stylesheets/application.bootstrap.scss:./app/assets/builds/application.css --no-source-map --load-path=node_modules " } to your package.json
package.json
{
"scripts ": {
"build ": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=assets ",
"build:css ": "sass ./app/assets/stylesheets/application.bootstrap.scss:./app/assets/builds/application.css --no-source-map --load-path=node_modules "
} ,
"dependencies ": {
// 省略...
}
application.jsの書き換え
このままではtooltipsやpopoverが動作しませんので、application.jsに以下を追記します。
app/javascript/application.js
document .addEventListener('turbo:load' , () => {
const popoverTriggerList = document .querySelectorAll('[data-bs-toggle="popover"]' )
const popoverList = [ ...popoverTriggerList] .map(d => new bootstrap.Popover(d))
const tooltipTriggerList = document .querySelectorAll('[data-bs-toggle="tooltip"]' )
const tooltipList = [ ...tooltipTriggerList] .map(d => new bootstrap.Tooltip(d))
} )
Procfile.devの書き換え
-b '0.0.0.0'の部分を追記します。
web : bin/rails server -p 3000 -b ' 0.0.0.0 '
js : yarn build --watch
css : yarn build:css --watch
database.ymlの書き換え
rails newで作成されたdatabase.ymlの設定を以下のように変更します。
config/database.yml
default : &default
adapter : postgresql
encoding : utf8
host : db
pool : <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
username : my_app
password : password
development :
<<: *default
database : my_app_development
test :
<<: *default
database : my_app_test
rails db:create
データベースを構築します。
docker-compose run web rake db:create db:migrate
アプリ起動
docker-compose up
upコマンドでアプリケーションを起動します。
docker-compose up
起動確認
localhost:3000にアクセスして以下の画面が表示されましたら完了です。お疲れ様でした！
起動確認
