未経験エンジニアの為効率的な記述でないもしくは間違っている場合があります。
気になった箇所はコメント頂けると幸いです。
使用OSはwindowsです。使用OSに関わるエラーはお答えできない場合があります。
前提 Docker Ruby 3.2.2 Rails:7.1.3.2はlocalにinstall済です。
Docker×Rails環境構築
アプリのディレクトリを作成し、ディレクトリに移動
mkdir testRails
cd testRails
ディレクトリ内でRailsアプリを作成、アプリ内に移動
-d postgresql:PostgreSQL使用の方は追加
-j esbuild:tailwindCSSとDaisyUIの環境構築する為に必要です。
tailwindCSSのオプションを追加するとDaisyUIの構築に失敗するので注意
rails new my_app -d postgresql -j esbuild
cd my_app
アプリ内で.env、entrypoint.sh、docker-compose.yml、Gemfile、Gemfile.lockを作成し以下のコードを記述。Dockerfileは上書き。
ユーザーネームを入れると権限エラーで./bin/dev時にforemanがinstallできなかったため、root推奨です。ここを解決できた方居ましたらコメントお待ちしてます。
USERNAME=root
#!/bin/bash
set -e
# Remove a potentially pre-existing server.pid for Rails.
rm -f /app/tmp/pids/server.pid
# Then exec the container's main process (what's set as CMD in the Dockerfile).
exec "$@"
version: '3'
services:
db:
image: postgres:15.5 # バージョンを15.5にしています
environment:
POSTGRES_DB: app_development
POSTGRES_USER: root
POSTGRES_PASSWORD: password
volumes:
- postgres_data:/var/lib/postgresql/data
ports:
- "5432:5432"
web:
build:
context: .
dockerfile: Dockerfile
args:
USERNAME: ${USERNAME} # パーミッションエラー対策にユーザー名の環境変数を設定
command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
container_name: my_app_web
volumes:
- .:/app
environment:
- RAILS_ENV=development
ports:
- "3000:3000"
depends_on:
- db
volumes:
postgres_data:
Dockerfile
Install yarnの箇所はtailwindCSSとDaisyUIを構築する際に必要です。
FROM ruby:3.2.2
RUN apt-get update -qq && apt-get install -y build-essential libpq-dev nodejs postgresql-client
# Install yarn
RUN curl -sL https://deb.nodesource.com/setup_18.x | bash - \
&& wget --quiet -O - /tmp/pubkey.gpg 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 -qq \
&& apt-get install -y nodejs yarn
WORKDIR /app
COPY Gemfile /app/Gemfile
COPY Gemfile.lock /app/Gemfile.lock
RUN gem install bundler
RUN bundle install
COPY . /app
COPY entrypoint.sh /usr/bin/
RUN chmod +x /usr/bin/entrypoint.sh
ENTRYPOINT ["entrypoint.sh"]
# ビルド時の引数を定義
ARG USERNAME
# 環境変数を設定
ENV USERNAME ${USERNAME}
# 環境変数を使用
RUN if [ "$USERNAME" != "root" ]; then useradd $USERNAME --create-home --shell /bin/bash; fi && \
chown -R $USERNAME:$USERNAME db log storage tmp
USER $USERNAME
EXPOSE 3000
CMD ["rails", "server", "-b", "0.0.0.0"]
database.ymlを編集
# PostgreSQL. Versions 9.3 and up are supported.
default: &default
adapter: postgresql
encoding: unicode
pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
host: db
username: root
password: password
development:
<<: *default
database: my_app_development
test:
<<: *default
database: my_app_test
production:
<<: *default
database: my_app_production
username: my_app
password: <%= ENV["MY_APP_DATABASE_PASSWORD"] %>
アプリ内でdockerイメージを構築
docker compose build
アプリ内でdockerコンテナを構築・起動
docker compose up
dockerコンテナに入り、dbを構築
docker compose exec web bash
bin/rails db:create
ここでDocker×Rails構築が完了します
tailwindCSSの環境構築
コンテナ内のまま実行していきます。
permission対策の為インストール先と参照先を変更してgemをインストール
bundle install --path vendor/bundle
環境構築検証を兼ねたトップ画面を作成
rails g controller Tops index
<h1 class="text-3xl font-bold underline">
Hello world!
</h1>
<button class="bg-gray-900 hover:bg-gray-800 text-white rounded px-4 py-2">tailwind</button>
<button class="btn">daisyUI</button>
ルーティング調整
Rails.application.routes.draw do
root 'tops#index'
end
Gemfile
#tailwindCSSインストール用
gem 'cssbundling-rails'
gem 'jsbundling-rails'
コンテナ内で実行
bundle install
rails css:install:tailwind
DaisyUIの環境構築
コンテナ内で実行
yarn add daisyui
tailwind.config.jsにプラグインを追加
module.exports = {
content: [
'./app/views/**/*.html.erb',
'./app/helpers/**/*.rb',
'./app/assets/stylesheets/**/*.css',
'./app/javascript/**/*.js'
],
plugins: [
require('daisyui')
]
}
}
コンテナ内でサーバーを立ち上げる(なぜbin/devを使うかは参考記事をご覧ください)
./bin/dev
お疲れさまでした！本番環境はRender.comにデプロイ予定です。成功したら本番環境編も執筆予定です。
参考記事
同じスクール生のnotion
Dockerでrails7 + tailwind + daisyuiの環境構築をする
【Rails7】TailwindCSS + daisyUIを導入する
bin/devってなんだ