5
6

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.

Railsアプリケーションをセットアップ後にdeviseとSlimを導入する手順(deviseのマイグレ・モデルに関する細かな設定は省略)

Last updated at Posted at 2020-06-09

始めに

Railsアプリケーションを立ち上げた後は、deviseとSlimはほとんど必ず先に導入するので、カンニング用に記事として残して置くことにしました。

環境

Ruby 2.6.5
Rails 5.2.4.2
PostgreSQL
devise
Slim

Railsアプリケーションのセットアップ

###1.Rubyのインストールとバージョンの設定

$ rbenv install 2.6.5   //バージョンを指定してrubyをインストール
$ rbenv local 2.6.5    //バージョンをそのプロジェクトのみに指定
$ ruby -v             //現在のバージョンを確認
  > ruby 2.6.5...

 ・インストールと設定ができてる場合は省略。

###2.Railsのインストールとバージョンの設定

$ gem install rails -v 5.2.4.2  //Railsをバージョンを指定してインストール
$ rails -v                     //バージョン確認
  > Rails 5.2.4.2

 ・インストールと設定ができている場合は省略。

###3.Node.jsのインストール。

$ brew install node

 ・インストールされている場合は省略。

###4.データベースのインストールとセットアップ(PostgreSQL)。

$ brew install postgresql
$ postgres -V                      //正常にインストールされていることを確認
$ brew services start postgresql  //PostgreSQLを起動するコマンド
$ brew services stop postgresql  //PostgreSQLを停止コマンド

 ・インストールされている場合は省略。
 ・PostgreSQLを起動してないままだとDBが作成できないので起動しておく。

5.Railsのバージョンを指定して、rails newを実行してひな形を作成する。

$ cd
$ rails _5.2.4.2_ new sample_app -d postgresql
$ cd sample_app

6.データベースを作成する。

$ bin/rails db:create  //データベースを作成すれば、railsサーバーが起動できるようになる。

7.gem deviseとSlim導入

Gemfile

gem 'slim-rails'  #Slimのジェネレータを提供
gem 'html2slim'  #ERB形式のファイルをslim形式に変換してくれる
gem 'devise'
$ bundle

8.deviseをインストール

$ rails g devise:install
    create  config/initializers/devise.rb
    create  config/locales/devise.en.yml
===============================================================================

Some setup you must do manually if you haven't yet:

  1. Ensure you have defined default url options in your environments files. Here
     is an example of default_url_options appropriate for a development environment
     in config/environments/development.rb:

       config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }

     In production, :host should be set to the actual host of your application.

  2. Ensure you have defined root_url to *something* in your config/routes.rb.
     For example:

       root to: "home#index"

  3. Ensure you have flash messages in app/views/layouts/application.html.erb.
     For example:

       <p class="notice"><%= notice %></p>
       <p class="alert"><%= alert %></p>

  4. You can copy Devise views (for customization) to your app by running:

       rails g devise:views

===============================================================================

9.deviseインストールと同時に指示される4つの指示に従い編集を行う

#### 9-1. 1つ目

config/environments/development.rb

Rails.application.configure do
.
.
.
  config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }
.
.
.
end

#### 9-2. 2つ目(自分がアプリに設定しようと思っているroot_urlを指定)

$ rails g controller posts new index show
config/routes.rb

Rails.application.routes.draw do
  root to: 'posts#index'
  resources :posts
  .
  .
  .
end

#### 9-3. 3つ目

app/views/layouts/application.html.erb

<p class="notice"><%= notice %></p>
<p class="alert"><%= alert %></p>

#### 9-4. 4つ目

$ rails g devise:views

invoke  Devise::Generators::SharedViewsGenerator
      create    app/views/devise/shared
      create    app/views/devise/shared/_error_messages.html.erb
      create    app/views/devise/shared/_links.html.erb
      create    app/views/devise/confirmations
      create    app/views/devise/confirmations/new.html.erb
      create    app/views/devise/passwords
      create    app/views/devise/passwords/edit.html.erb
      create    app/views/devise/passwords/new.html.erb
      create    app/views/devise/registrations
      create    app/views/devise/registrations/edit.html.erb
      create    app/views/devise/registrations/new.html.erb
      create    app/views/devise/sessions
      create    app/views/devise/sessions/new.html.erb
      create    app/views/devise/unlocks
      create    app/views/devise/unlocks/new.html.erb
      create    app/views/devise/mailer
      create    app/views/devise/mailer/confirmation_instructions.html.erb
      create    app/views/devise/mailer/email_changed.html.erb
      create    app/views/devise/mailer/password_change.html.erb
      create    app/views/devise/mailer/reset_password_instructions.html.erb
      create    app/views/devise/mailer/unlock_instructions.html.erb

10.ここで全てのビューをSlimに変換する

$ bundle exec erb2slim app/views/ --delete

 _※deviseのディレクトリに関してはSlimに変換するとdevise/shared/error_messages.html.slimでエラーが起きるので修正する。

devise/shared/_error_messages.html.slim
- if resource.errors.any?
  #error_explanation
    h2

      #以下の3行でエラーが出るので以下のように修正
      = I18n.t("errors.messages.not_saved",
        count: resource.errors.count,
        resource: resource.class.model_name.human.downcase)

    ul
      - resource.errors.full_messages.each do |message|
        li
          = message

11.認証機構のビューを作成

app/views/layouts/application.html.slim

html
  head
  .
  .
  .
  body
    - if user_signed_in?
      =link_to 'ログアウト', destroy_user_session_path, method: :delete
    - else
      =link_to '新規登録', new_user_registration_path
      =link_to 'ログイン', new_user_session_path
  .
  .
  .

 ・deviseの、どのパスがどのアクションへ繋がっているかわからなくなったらrails routesコマンドで確認。

12.モデルの作成

$ rails g devise User
$ rails g migration add_columns_to_users username:string introduction:text

$ rails g model Post content:string user:references 
$ rails g model Favorite user:references post:references
$ rails g model Comment content:string user:references post:references
$ rails db:migrate

 ・$ rails g devise Userを実行するとユーザー認証に必要なマイグレーションを用意してくれる。

 ・deviseで作成されるデフォルトのUserモデルにはカラム追加できないので、nameカラムなどを追加する場合は、ジェネレートコマンドで新たにマイグレーションを作成する必要がある。

 ・上記では、Userモデル、Postモデル、Favoriteモデル、Commentモデルが存在していて、ユーザーが自由に投稿をできて、その投稿に対してコメントやいいねができるアプリを作成する場合を想定してます。

 ※deviseのマイグレーションやモデルに関する細かな設定は省略。

5
6
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
5
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?