3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

rails6 + docker + postgreSQL + Materializeで開発環境を作ってみた。

Posted at

##railsの環境構築

Docker3
Rails6.0.3
Ruby2.7.0
DB:PostgeSQL
こちらの環境で作成していきます。

##1.dockerを立ち上げる
@shungo_m様の「DockerでRails6の環境構築を行う方法」を参考にしました。

docker立ち上げに必要なファイルの作成

$ mkdir myapp
$ cd myapp
$ touch Dockerfile
$ touch docker-compose.yml
$ touch entrypoint.sh
$ touch Gemfile
$ touch Gemfile.lock

Dokerfile
FROM ruby:2.7.0
RUN apt-get update -qq && apt-get install -y nodejs postgresql-client

RUN apt-get update && apt-get install -y curl apt-transport-https wget && \
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 yarn

RUN curl -sL https://deb.nodesource.com/setup_7.x | bash - && \
apt-get install nodejs

RUN mkdir /myapp
WORKDIR /myapp
COPY Gemfile /myapp/Gemfile
COPY Gemfile.lock /myapp/Gemfile.lock
RUN bundle install
COPY . /myapp

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"]
docker-compose.yml
version: '3'
services:
  db:
    image: postgres
    volumes:
      - ./tmp/db:/var/lib/postgresql/data
    environment:
      POSTGRES_HOST_AUTH_METHOD: 'trust'


  web:
    build: .
    command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
    volumes:
      - .:/myapp
    ports:
      - "3000:3000"
    depends_on:
      - db
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 "$@"
Gemfile
source 'https://rubygems.org'
gem 'rails', '~>6'
Gemfile.lock

必要なファイルの作成が出来たので、rails newでプロジェクトの作成。

$ docker-compose run web rails new . --force --no-deps --database=postgresql --skip-bundle

そのままdocker build、upと進めるとwebpackerをインストールしてねと言われるので、インストールをする。

$ docker-compose run web bundle exec rails webpacker:install

その後はDBの設定をして、docker環境が完成。

##2.Materiarizeの導入
こちらのサイトを参考にしました。https://monaga.site/use-materialize-in-rails6/

$ docker-compose run web yarn add materialize-css

app/javascript/packsapplication_style.jsというファイルを作成・記述します。

application_style.js
import "../stylesheets/application.scss";;

app/javascript/stylesheets ディレクトリの中に application.scssファイルを作成・記述します。。

application.scss
@import "materialize-css/dist/css/materialize.min.css";

最後にjavascriptの読み込みに必要なコードを app/javascript/packs/application.jsに追記します。

application.js
import "materialize-css/dist/js/materialize.min.js";
M.AutoInit();

これで環境構築完了です。

materializeの公式ページにはサンプルが多くあるので、参考にしてください。
https://materializecss.com/

####参考
https://materializecss.com/
https://monaga.site/use-materialize-in-rails6/
https://qiita.com/shungo_m/items/fd1ab99fbe76d39e456c

3
0
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
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?