Create a Ruby on Rails (Rails-Postgresql-React) App using Docker Compose

This tutorial is intended to be a quick guide.

Create a new Rails application via Docker with the following Command

docker run -it ruby:3.0.2 gem install rails bundler \
  && rails new exampleapp -d=postgresql --webpack:react --skip-coffee

Once the application is created, go to the application directory. All application files will be found there.

cd exampleapp

Create a File called Dockerfile with the Following Content

// dockerfile

FROM ruby:3.0.2
RUN apt-get update -qq \
&& apt-get install -y curl build-essential libpq-dev \
 nodejs postgresql-client &&\
  curl -sL https://deb.nodesource.com/setup_10.x | bash - && \
  curl -sS 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 && apt-get install -y nodejs yarn
ADD . /app
WORKDIR /app
RUN bundle install
EXPOSE 3000
CMD ["bash"]

This file will help Docker Compose build an image with all the needed dependencies installed to handle Rails. It will use Postgresql as a database engine and React bundled with webpack.

Create a File Called docker-compose.yml With the Following Content

version: '3.8'
services:
  db:
    env_file: .env
    image: postgres
  web:
    build: .
    command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
    volumes:
      - .:/app
    ports:
      - "3000:3000"
    depends_on:
      - db
    env_file: .env
    environment:
      RAILS_ENV: development
      RAILS_MAX_THREADS: 5
volumes:
  postgres:

Create a .env File

Add the following environment variables. Pay special attention to the POSTGRES_ variable names since the pg image will need them for a proper setup, as well as the DATABASE_URL, which is needed by web. The query strings need to match with the other variable’s values. In the DATABASE_URL, the host is db, which is the name exposed by Docker Compose.

POSTGRES_DB=postgres
POSTGRES_USER=postgres
POSTGRES_PASSWORD=secret
DATABASE_URL=postgres://postgres:secret@db:5432/postgres

Edit Database.yml

Edit the config/database.yml file and add url: <%= ENV.fetch("DATABASE_URL") { '' } %> Here is an example of a valid config file for this tutorial. Keep in mind the way you expose sensitive data and the environments you are building the Docker Compose for.

default: &default
  adapter: postgresql
  encoding: unicode
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  url: <%= ENV.fetch("DATABASE_URL") { '' } %> # This is the line we added
development:
  <<: *default
  database: exampleapp_development
test:
  <<: *default
  database: exampleapp_test
production:
  <<: *default
  database: exampleapp_production
  username: exampleapp
  password: <%= ENV['EXAMPLEAPP_DATABASE_PASSWORD'] %>

Start the App

The application is ready. We can start our application now. We are adding the --build parameter the first time, so that Docker Compose builds the containers first.

docker-compose up --build

Go to Localhost

We can now go to http://localhost:3000 in our browser. We should see the “Yay! You’re on Rails!” screen.

Now we can run commands (for example, generators and migrations) to evolve our application. We will now create a model with their controller and views, and then run a migration in this example.

The model will be Coin, and will have a name (string) and a value (float).

docker-compose run web rails g scaffold Coin name:string value:float \
 && rails db:migrate

Here is a quick video of all that we have seen until now.