0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Rails7(esbuild + Tailwind + MySQL)をDocker Composeで環境構築してデバッグも行えるようにする

Last updated at Posted at 2023-07-28

株式会社TECH LUCKという会社で代表兼エンジニアをしている齊藤です。

DXプロジェクト、開発プロジェクト、Rails開発などでお困りごとがありましたら弊社HPからご相談をいただけますと幸いです。
以下のような問題に対応することが可能です。

  • プロジェクトでRailsエンジニアが足りなくて困っている
  • Railsのバージョンアップをしたいがノウハウ・リソースが足りなくて困っている
  • オフショア開発をしているが、要件の齟齬やコード品質が悪いので改善したい

また、Railsエンジニアも募集しておりますので、興味がありましたら弊社HPからご連絡いただけますと幸いです。

前提

Rails7の環境構築でesbuild,Tailwind, MySQLでの構成の際に、Docker Composeで環境構築する際にハマったところなどをまとめておきました。
また、自分が書いた他の記事では、Dockerを使っている際にpry-railspry-byebugを使っている際にデバッグがおかしくなるため、docker-compose.ymlを書き換えてdocker attachでのデバッグが正常に行えるようにしました。

開発環境は以下の通りです。

  • M1 Mac
  • Ruby v3.2(RailsのDockerコンテナの中でのバージョン)
  • Rails v7.0.5(RailsのDockerコンテナの中でのバージョン)
  • Node v18.16.1(RailsのDockerコンテナの中でのバージョン)
  • MySQL v8.0.32(MySQLコンテナの中でのバージョン)

Docker Composeを実行する前に作成・変更が必要なファイル

entrypoint.sh

以下の記述で作成します。

entrypoint.sh
#!/bin/bash
set -e

# Remove a potentially pre-existing server.pid for Rails.
rm -f /myapp/tmp/pids/server.pid

# Then exec the container's main process (what's set as CMD in the Dockerfile).
exec "$@"

Dockerfile

以下の記述で作成します。

Dockerfile
FROM ruby:3.2.0

RUN curl -fsSL https://deb.nodesource.com/setup_lts.x | bash - && apt-get install -y nodejs
RUN apt-get install -y default-mysql-client
RUN npm install -y --global yarn

WORKDIR /myapp
COPY . /myapp

RUN bundle install
RUN yarn 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"]

database.yaml

以下のように変更します。

config/database.yml
default: &default
  adapter: mysql2
  encoding: utf8mb4
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  username: root
  password:
  socket: /tmp/mysql.sock

development:
  <<: *default
  host: db #ここを追加
  database: instalike_development

test:
  <<: *default
  host: db #ここを追加
  database: instalike_test

docker-compose.yml

以下の記述で作成します。

docker-compose.yml
version: '3.8'
services:
  db:
    image: mysql:8.0.32
    command: --default-authentication-plugin=mysql_native_password
    container_name: db
    ports:
      - 4306:3306
    volumes:
      - db:/var/lib/mysql
    environment:
      MYSQL_ALLOW_EMPTY_PASSWORD: 'yes'
      TZ: Asia/Tokyo
    security_opt:
      - seccomp:unconfined
  app:
    tty: true
    stdin_open: true
    container_name: app
    build:
      context: .
      dockerfile: Dockerfile
    volumes:
      - .:/myapp
      - bundle:/usr/local/bundle
      - node_modules:/myapp/node_modules
      - public-data:/myapp/public
      - tmp-data:/myapp/tmp
    command: bash -c "rm -rf tmp/pids/server.pid && rails server -b 0.0.0.0 -p 3000"
    environment:
      TZ: Asia/Tokyo
    depends_on:
      - db
    ports:
      - 3000:3000
  front-build:
    tty: true
    stdin_open: true
    container_name: front-build
    build:
      context: .
      dockerfile: Dockerfile
    volumes:
      - .:/myapp
      - bundle:/usr/local/bundle
      - node_modules:/myapp/node_modules
      - public-data:/myapp/public
      - tmp-data:/myapp/tmp
    command: bash -c "yarn build --watch && yarn build:css --watch"
    environment:
      TZ: Asia/Tokyo
    depends_on:
      - db
volumes:
  db:
    driver: local
  bundle:
    driver: local
  node_modules:
    driver: local
  public-data:
  tmp-data:

appのcommandについて

Railsサーバーを起動しています。

front-buildのcommandについて

CSS・JSのビルドと変更の監視をしています。

node_modulesについて

yarn installした際にnode_modulesvolumesに保存するようにします。
これをしないと、docker compose upの途中の./bin/devの実行の際に以下のようなエラーが出てきます。

エラー文
app  | 12:42:23 js.1   | $ esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=/assets --watch
app  | 12:42:23 css.1  | $ tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify --watch
app  | 12:42:23 js.1   | /bin/sh: 1: esbuild: not found
app  | 12:42:23 js.1   | error Command failed with exit code 127.
app  | 12:42:23 js.1   | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
app  | 12:42:23 css.1  | /bin/sh: 1: tailwindcss: not found
app  | 12:42:23 css.1  | error Command failed with exit code 127.
app  | 12:42:23 css.1  | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
app  | 12:42:24 js.1   | exited with code 127
app  | 12:42:24 system | sending SIGTERM to all processes
app  | 12:42:24 css.1  | exited with code 127

これはnode_modulesが保存されていないために、yarn build --watchの実行がエラーになってしまうためです。
そのため、volumesを使ってnode_modulesを永続化させるようにします。

Docker Composeの実行

必要なファイルが揃ったら、以下のコマンドを実行してDocker Composeでアプリケーションを起動させます。

ターミナル
docker compose build --no-cache
docker compose up -d

# 以下は別のタブで実行する。
docker compose run app rails db:create rails db:migrate

Rails側のデバッグ

gem "pry-byebug"、もしくは、gem "pry-rails"をインストールして、処理を止めたい箇所にbinding.pryを記述します。

ターミナル
doceker comopse up -d
docker attach app

を実行すれば処理が止まるようになります。

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?