はじめに
この記事の概要
こんにちは、Rubyをメインで書いている株式会社TOKOSのツキヤです!
今回はRails7の開発環境をDockerで構築する方法を説明します!
Rails6バージョンは過去に書いていますので、ご参考ください😎
【Rails6】Dockerを用いたRails6の開発環境構築【コピペでOK】
Rails6と7の大きな違いとして、組み込まれるJavascriptのバンドラーがあります。
この違いも簡単に説明するので、分からない方はぜひ最後まで読んでみて下さい💪
対象読者
- Rails7 + Dockerの環境を構築したい方
- 開発環境を構築する上でのRails7と6の違いを知りたい方
今回作成する環境
技術等 | バージョン |
---|---|
ruby | 3.1.2 |
rails | 7.0.3 |
Webpack | 5.73.0 |
Rails6と7の違い
まずは6系と7系の違いを説明します!
と言っても、今回は開発環境の構築方法なので、環境構築に関わる部分だけの説明に留めておきます。
全体的な違いが知りたい方は、下記記事を参考にして下さい🙏
参考
Ruby on Rails 7の主要な新機能・機能追加・変更点Qiita
参考
Rails 7.0 + Ruby 3.1でゼロからアプリを作ってみたときにハマったところあれこれQiita
デフォルトでインストールされるJavascriptのライブラリの違いが1番大きいです!
Rails6の時はWebpackerという、Webpackのラッパーがインストールされていました。
ツキヤ
Rails7は、このJSのまとめ役のようなものがrails newの際に4種類から選べるようになりました!
具体的には、importmap・esbuild・Rollup・Webpackの4つです!
つまり、Webpackerはその中に入っておらず、Rails6と同じように開発・デプロイをしようと思ったらWebpackを選択する必要があります😨
それぞれの説明は今回割愛しますが、大事なことは何も選択しなかった場合のデフォルトはimportmapになってしまうということです🙄
Rails6までと同じような感じで使うためには、Webpackを選択することが必要です!
CSSに関しても同様で、rails newする際に任意のライブラリを選択する事ができます。
具体的には、
- TailwindCSS
- Bootstrap
- bulma
- postcss
- sass
です!
Rails6ではデフォルトでsassが入っていたかと思いますが、Rails7では何も入っていなさそうですね🤔
構築方法
それでは早速構築方法の説明をしていきます!
前提として、MacOS + Docker for Desktopを使っていきますので、Windowsの方は適宜読み替えをしてください。
またRails6と違う部分を重点的に書きますので、まずは下記のRails6バージョンの記事を読んでいただけると理解がスムーズになると思います!
【Rails6】Dockerを用いたRails6の開発環境構築【コピペでOK】
ファイルの作成・記述
$ touch Dockerfile docker-compose.yml entrypoint.sh Gemfile Gemfile.lock my.cnf
上記コマンドを打つことで必要なディレクトリとファイルが全て作成されます!
version: "3"
services:
app:
build: .
command: bash -c "rm -f tmp/pids/server.pid && ./bin/dev"
# raisl6の場合: command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
volumes:
- .:/myapp:delegated
ports:
- "3000:3000"
depends_on:
- db
tty: true
stdin_open: true
db:
image: mysql:8.0
environment:
MYSQL_ROOT_PASSWORD: password
ports:
- '3306:3306'
volumes:
- ./tmp/db:/var/lib/mysql:delegated
- ./my.cnf:/etc/mysql/conf.d/my.cnf
cap_add:
- SYS_NICE
Rails6との違いとしては、5行目のbundle exec rails s -p 3000 -b ‘0.0.0.0’が./bin/devになっているところです!
これは、Rails7でのサーバーの立ち上げコマンドがbin/devになったことによる変更です!
他はRails6とバージョンくらいしか違いが無いのでまとめて載せておきます!
(ファイル名はコードボックスの右上に書いてあります)
FROM ruby:3.1.2
ENV TZ Asia/Tokyo
RUN curl -fsSL https://deb.nodesource.com/setup_16.x | bash - \
&& apt-get update -qq \
&& apt-get install -y nodejs \
&& npm install -g yarn
WORKDIR /myapp
RUN gem install bundler
COPY Gemfile /myapp/Gemfile
COPY Gemfile.lock /myapp/Gemfile.lock
RUN bundle install
COPY entrypoint.sh /usr/bin/
RUN chmod +x /usr/bin/entrypoint.sh
ENTRYPOINT ["entrypoint.sh"]
EXPOSE 3000
CMD ["rails", "server", "-b", "0.0.0.0"]
#!/bin/bash
set -e
rm -f /myapp/tmp/pids/server.pid
exec "$@"
source 'https://rubygems.org'
gem 'rails', '~>6.1.4'
[mysqld]
character-set-server=utf8mb4
collation-server=utf8mb4_general_ci
default-authentication-plugin=mysql_native_password
default-character-set=utf8mb4
Gemfile.lockは相変わらず空です!
コマンド
それではnewのコマンドを打ち込みます!
$ docker-compose run --no-deps app rails new . --force --database=mysql --javascript=webpack --skip-test
$ docker-compose build
この–javascript=webpackの記述でJavascriptのバンドラーはWebpackになります!
またTailwindCSSを使いたいときはコマンドに追加で–css=tailwind、Bootstarapを使いたいときは–css=bootstrapを追記するだけです🥳
あとは、config/database.ymlのデータベースの設定をRails6と同様に記述した上で$ docker-compose upコマンドでRails7の画面が確認できるハズです!
終わりに
Rails7でWebpackを使うのであれば、Rails6とほぼ変わりなく環境構築ができそうですね!
Rails7では他にもTurboやStimulusというフロントエンド側の大幅アップデートがあり、そちらも記事に書いていく予定ですのでお楽しみに😎
Railsの勉強をしたい方はこの本が参考になるかと思いますので興味がある方は是非読んで見て下さい🙇♂️