カテゴリー
サインイン 新規登録

間違いや改善の指摘

内容の技術的な誤り・誤字脱字やミスのご報告・解説やトピックの追記/改善のご要望は教材をさらに良くしていく上でとても貴重なご意見になります。

少しでも気になった点があれば、ご遠慮なく投稿いただけると幸いです🙏

実際には誤りではなく勘違いであっても、ご報告いただけることで教材のブラッシュアップにつながります。

質問ポリシー①

教材受講者みなさんのスムーズな問題解決のために、心がけていただきたいことがあります。

教材の内容に関する質問を投稿しましょう

教材の内容に関係のない質問や教材とは異なる環境・バージョンで進めている場合のエラーなど、教材に関係しない質問は推奨していないため回答できない場合がございます。

その場合、teratailなどの外部サイトを利用して質問することをおすすめします。教材の誤字脱字や追記・改善の要望は「文章の間違いや改善点の指摘」からお願いします。

2-2

Deviseの導入

この章ではユーザーの新規登録・ログイン機能を開発していきます。

ユーザーの新規登録・ログイン機能を簡単に作成するために今回DeviseというGemを導入します。

Deviseはユーザー登録やログイン機能などの認証に必要な機能を簡単に追加できるRails用のGemです。

公式ドキュメントはこちらです。

devise公式ドキュメント

早速導入していきましょう。

この章で学べること

Copied!
- Deviseを使ったユーザー新規登録・サインイン機能の実装

学習キーワード

Copied!
- Devise - フラッシュメッセージ - Gem - モデル

DeviseをGemfileに追加してインストールする

Gemfile というファイル内の最下部にdeviseを追加します。

Copied!
gem 'devise'

次にbundle install を行い、deviseを使えるようにします。

Copied!
$ bundle install

次に以下のコマンドを実行してdeviseの初期ファイルのインストールを行います。

Copied!
$ rails g devise:install

上記コマンドを実行すると以下のファイルが作成されます。

Copied!
create config/initializers/devise.rb create config/locales/devise.en.yml

ファイルを作成すると、ターミナルに以下のようなメッセージが表示されます。

こちらはdeviseを使う上での初期設定になるので、1から順に行なって行きましょう。

Copied!
=============================================================================== 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 ===============================================================================

1に書いてあるとおり、
config/environments/development.rbの末尾のendの上に以下のコードを追加してください。

Copied!
config └── environments └── development.rb
config/environments/development.rb
12345
Copied!
. . . config.action_mailer.default_url_options = { host: 'localhost', port: 3000 } # ここの一行を追加 end

deviseのフラッシュメッセージを追加する

フラッシュメッセージとはある動作を行った時、成功したのか、もしくは失敗したのか、相手に知らせる機能のことです。
たとえばメールアドレスが正しくなく、ログインに失敗した時、エラーを表示したりします。

app/views/layouts/application.html.erbに以下のコードを追加してください。

Copied!
app └── views └── layouts └── application.html.erb
app/views/layouts/application.html.erb
12345678910111213141516171819
Copied!
. . . <body> <%# ==========ここから追加する========== %> <% if flash[:notice] %> <p><%= flash[:notice] %></p> <% end %> <% if flash[:alert] %> <p><%= flash[:alert] %></p> <% end %> <%# ==========ここまで追加する========== %> <%= yield %> </body> . . .

devise用のviewファイルをインストールする

以下のコマンドでdevise用のviewファイルを生成します。

deviseのviews(表示される画面)の生成を行います。

Copied!
$ rails g devise:views

実行すると以下のようなファイルが生成されます。どのようなファイルが生成されたかを見てみましょう。実行結果を見てみることは大事です。さまざまな「.html.erb」という拡張子のファイルが作成されています。例えば「app/views/devise/registrations/new.html.erb」はサインアップ画面のviewファイルになります。Deviseを使うと、コマンドひとつで一気に複数のファイルを作成してくれます。一から自分で作るより全然便利ですよね。これがGemの魅力でもあります。

Copied!
invoke Devise::Generators::SharedViewsGenerator create app/views/devise/shared 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

Userモデルを作成する

以下のコマンドでdevise用のUserモデルを作成します。
モデル名の値は任意です。作成したいModel名で作成できます。今回はUserというモデル名で作成します。

Copied!
$ rails g devise User

以下のようなファイルが作成されました。こちらもどのような物が生成されたか見てみましょう。

Copied!
invoke active_record create db/migrate/20180925032152_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

Usersテーブルを作成する

先ほどUserモデルを作成した際、db/migrate/フォルダの中にマイグレーションファイルが作成されました。
ただマイグレーションファイルはあくまでテーブルの設計図です。
設計図をDBへ反映しなければ、テーブルを作る・カラムを追加するなどの変更を行うことはできません。
なのでrails db:migrate コマンドを実行することで、マイグレーションファイルを元にテーブルを作成します。

マイグレーションファイルを実行するには以下のコマンドで実行できます。

Copied!
$ rails db:migrate

マイグレーションを実行すると、以下のように複数のテーブルが作られます。

Copied!
== 20180925032152 DeviseCreateUsers: migrating ================================ -- create_table(:users) -> 0.0013s -- add_index(:users, :email, {:unique=>true}) -> 0.0008s -- add_index(:users, :reset_password_token, {:unique=>true}) -> 0.0018s == 20180925032152 DeviseCreateUsers: migrated (0.0042s) =======================

サーバーを立ち上げてdeviseの導入がうまくいったかの確認

まず以前立ち上げていたサーバーを終了させます。終了させるにはcontrol とcを同時に押せば大丈夫です。

その後「rails s コマンド」でローカルサーバーを立ち上げます。ちなみにsはserverの略です。

Copied!
$ rails s

そして、http://localhost:3000/users/sign_up を開くと以下の画面のようにログイン画面が表示されていれば問題ありません。

image

以上でこのパートは終了です。DeviseというGemの力を借りたことで、簡単に会員登録機能ができました。

次のパートでは実際にログインができるかどうかの確認を行います。

次のパートではログインができるかどうかの確認を行なっていないのでこの1文を削除するか、「次のパート以降で」という部分を追加するといいと思います。

※実際に運用している世の中のサービスではDeviseというGemを使っている場合もあれば使っていない場合もあります。なぜかというと、Gemを使うとスピーディーな開発ができて便利という反面、0から自分で開発していないためにできることの制約があります。そういった面も踏まえてGemを使うか使わないかの判断はした方がよいです。

現在のパート (6)
全パート (211)
みんなで助け合おう!
現在のパートのディスカッション 全6件
2-2
川平 2020-04-27
質問です

Mac

お尋ねします。進めながら、既にダウンロード済みにも関わらず、上書き保存を繰り返したところ、画像の様なエラーになりました。

rails db:drop

rails db:create

rails db:migrate

を試したのですが、エラーは消えません。dbが存在するのに上書きでエラーが発生したものと考えています。
こういう場合、rails newで新たに作った方が良いのでしょうか。

削除方法の確認
$ cd ..
$ rm -rf ○○○

Migrations are pending. To resolve this issue, run: bin/rails db:migrate RAILS_ENV=development

で検索するとやはり、既に存在するdbを一度、リセットした方が良いと解釈しております。

ヒントを頂けると助かります。どうぞ宜しくお願い致します。

image

image

2-2
アキヅキテルトモ 2020-03-14
質問です

おせわになっています。rails g devise:viewsを行うと下記のエラーがでてしまいます。
ググってもなかなか解決しないため、ご質問をさせてください。

発生しているエラー

/.rbenv/versions/2.5.1/lib/ruby/gems/2.5.0/gems/bootsnap-1.4.6/lib/bootsnap/load_path_cache/core_ext/active_support.rb:80:in `block in load_missing_constant': uninitialized constant Devise (NameError)

###試したこと
サーバーの再起動をためしてみたのですが、下記のエラーがでています。。
uninitialized constant Devise (NameError)

2-2
jo 2019-10-07
質問です

rails g devise:viewsやrails cをすると、『`require': cannot load such file -- devise/orm/ridgepole (LoadError)』というエラーがでてしまうのですが、どうしたらよいでしょうか。調べてもでてこなかったです。

2-2
西方裕人 2018-12-20
質問です

#サインアップの画面が表示されません

ターミナル上では問題なくプログラムが進み、ファイルも作成されたのですが、
相変わらず Top#index のページになっています。

過去の質問なども確認し、url の後に /sign_up を付け加えてアクセスると、Routing Error となってしまいました。
環境は cloud9 です。

よろしくお願いします!

2-2
宇原 寛人 2018-12-17
質問です

TOP画面作成時にgemfileに'devise'を追加し、$bundle installを
実行したまではよかったのですが、$rails g devise:install
を実行してもcreate config/initializers/devise.rb
create config/locales/devise.en.ymlのファイルが作成されません。

どこが悪いのでしょうか・・・
よろしくお願いします。

image