【Rails】deviseの導入方法

## はじめに
Qiita初投稿です。初学者が記載していますので，間違いがあるかもしれません。ご指摘やアドバイスなどございましたら，ご教授いただけると幸いです。よろしくお願いします。

【**環境**】

- macOS Catalina 10.15.7
- Vagrant 2.2.4 (CentOS 7.1)
- Ruby 2.5.7
- Rails 5.2.4.4
- devise 4.7.3

## deviseとは
deviseは，webアプリケーションへの認証機能の実装を簡単に行うことができるgemです。認証機能とは，簡単に述べるとログインやログアウト機能のことです。ユーザー情報を扱うため，セキュリティ面への不安や，工数が多くなるなど，1から作成することは大変です。deviseを使うことによって，上述の問題を解消し，認証機能の実装を簡単にしてくれます。

## deviseの導入

### 1. gemのインストール
Gemfileに以下を記述します。

```:Gemfile
gem 'devise'
```

保存したあと，以下のコマンドを入力して，アプリケーションに読み込ませます。

```:ターミナル
$ bundle install
```

以上でインストールは完了です。

### 2. deviseの初期設定
次に以下のコマンドを入力して，deviseの初期設定を行います。

```:ターミナル
$ rails g devise:install
```

以下の画面が表示されたら成功です。

```:ターミナル
      create  config/initializers/devise.rb
      create  config/locales/devise.en.yml
===============================================================================

Depending on your application's configuration some manual setup may be required:

  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.

     * Required for all applications. *

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

       root to: "home#index"
     
     * Not required for API-only Applications *

  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>

     * Not required for API-only Applications *

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

       rails g devise:views
       
     * Not required *

===============================================================================
```
ちなみに私がdevise使い始めたときは，この初期設定をすっ飛ばしてエラーになることが何度かありました・・・。もしうまくいかない場合は初期設定ができているか確認してみてもいいかもしれません。


### 3. ログイン画面を表示する
deviseの機能を使って，Userモデルを作成します。
モデル名を別のものにしたい場合はUserの部分をそのモデル名にします。
通常のモデル作成時とは異なり，**rails g devise モデル名** となることに注意しましょう。

```:ターミナル
$ rails g devise User
```

以下のような画面が表示されれば成功です。

```:ターミナル

    invoke  active_record
    create    db/migrate/20201103032107_devise_create_users.rb
    create    app/models/user.rb
    invoke    test_unit
    create      test/models/user_test.rb
    create      test/fixtures/users.yml
    insert    app/models/user.rb
      route  devise_for :users
```

作成されたマイグレーションファイルを読み込みます。
マイグレーションファイルとは，簡単に述べるとテーブルの設計図となるものです。上の画面の2行目 db/migrate/作成された年月年月日時分秒_devise_create_users.rb がマイグレーションファイルです。

```:ターミナル

$ rails db:migrate
```

以下のような画面が表示されれば成功です。

```:ターミナル

== 20201103032107 DeviseCreateUsers: migrating ================================
-- create_table(:users)
   -> 0.0046s
-- add_index(:users, :email, {:unique=>true})
   -> 0.0014s
-- add_index(:users, :reset_password_token, {:unique=>true})
   -> 0.0014s
== 20201103032107 DeviseCreateUsers: migrated (0.0076s) =======================
```

この時点でdeviseの導入は完了です。以下のURLでログイン画面にアクセスできます。(各画面のURLはrails routesコマンドで確認できます)

/users/sign_in
<img width="400" alt="login.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/700730/175ae78f-5a41-d653-b83d-64699f5a557f.png">

## 補足
### deviseの設定を確認する

セットアップが完了すると，config/routes.rbにルーティングが自動で追加され，deviseを使用する際のURLにusersが含まれるようになります。

```Ruby:config/routes.rb
devise_for :users
```

また，app/models/user.rbに以下の記述が追加されます。deviseの基本的な機能がデフォルトで記述されています。

```Ruby:app/models/user.rb
devise :database_authenticatable, :registerable,
        :recoverable, :rememberable, :validatable
```

- **database_authenticatable**
  データベースに保存されたパスワードの正確性の検証，暗号化

- **registerable**
  ユーザーの登録，編集，削除機能

- **recoverable**
  パスワードのリセット

- **rememberable**
  ログイン情報の保存。ログイン状態を維持する機能

- **validatable**
  emailやパスワードのバリデーションを追加

### ログイン画面のカスタマイズ

次のコマンドを実行してviewを作成します。

```:ターミナル

$ 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
    invoke  form_for
    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
    invoke  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

```

例えば，ログイン画面のviewは 
app/views/devise/sessions/new.html.erb 

サインアップ画面のviewは 
app/views/devise/registrations/new.html.erb です。 

これらのファイルを編集してデザインを変更できます。

##参考文献
この記事は以下の情報を参考に執筆しました。

[[*Rails*] deviseの使い方（rails5版）](https://qiita.com/cigalecigales/items/f4274088f20832252374)
[rails devise完全入門！結局deviseって何ができるの？](https://www.sejuku.net/blog/13378)
[【Rails】deviseの使い方をマスターしてログイン認証機能を実装しよう！](https://pikawaka.com/rails/devise)