Deviseを用いた簡単なログイン機能実装方法
カテゴリ:インターン生ブログ
devise 機能とは?
devise とは、Railsに入っているgemの一種で、新規登録やログイン機能を簡単に実装してくれます!
では、早速始めていきましょう!
まずは、 Gemfileにこのように記述してください。
1.deviseのダウンロード
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/c356b7cc7e8b21339b3592734736495e.png)
その後に、
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/fc2e1bf59639caa214f41707d2b0107d.png)
すると、deviseが使えるようになります。
その後に、
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/4fd9c1c777341ff820ccab1cda4c2cd5.png)
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/fa107577845fcb0f57e57b3bc04efde3.png)
以下のファイルが生成されます。
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/52a487ee1cf6f222248f7fb676a0e5a5-1.png)
このように順番に設定するように手順が出てきます。
順を追って、設定していきますが、今回はメールの設定は行わないために、2から行っていきます。
2.ルーティングの設定
まずは、2番ですが、これはconfig/root.rbで最初に飛ぶページのルーティングを設定してください。
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/535656bd43ec6402e81b5698161708c5.png)
でこのような場合、homeコントローラーとtopページを作成する必要がありますが、特に指定はないため、
好きなように設定してみてください。
3、Flashメッセージの設定
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/b03113bebcb1519d4db5374b3e078841.png)
このように、bodyのすぐ下にFlashメッセージを書き込んでください。
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/025a472e411eb08b0a1d2c7198a5743a.png)
こんな感じです。
4.viewの作成
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/18c812312d0cb245a63a6e8291e129b1.png)
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/c9e9ff46bfa74220e94023d7a454e524.png)
このように、多くのviewファイルが生成されます。
viewファイルの中に、deviseのファイルがあり、これでデザインを触れるようになりました。
5.Userモデルの作成
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/ed2d7e54de05df3f4a7ab19310d0d663.png)
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/5d250d64c7597553f6002ff221399892.png)
そうすると、このようにUserモデルが自動的の作成してくれます。
Userテーブルをの作成
さっきのUserモデルを作成した時に、マイグレーションファイルも一緒の生成されました。
マイグレーションファイルとは、テーブルの設計図になります。それを元にテーブルが作られます。
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/3219b02ea6a780af8629f277b79408b2.png)
このコマンドを打つと、
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/3365748a7bbbad41a6075471528ccc47.png)
マイグレーションが実行され、テーブルが作られます。
これで、一通り、作り終えました。
確認
早速立ち上げて確認しましょう。
rails sで立ち上げて、http://localhost:3000/users/sign_up
を開くと、
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/caa0be5ca39ecfbddd12ce30d29b3321.png)
このように、サインアップの画面が表示されてれいます。
http://localhost:3000/users/sign_in
今度はこのリンクを開いてみると、
![](https://inglow.jp/wordpress/wp-content/uploads/2019/06/f2cd6f0025a69980bb6a4aca7dc06239.png)
このようにログイン画面が表示されていれば成功です。
以上が
deviseの実装方法でした。
細かい設定を知りたい方は、deviseの公式文を見て参考にしてください。
公式ドキュメントはこちらです。
https://github.com/plataformatec/devise
まとめ
今回はdeviseというgemを使ってログイン機能と登録機能を実装していきました。
素早く、設定できてとても便利なので、ぜひ使ってみてください。
inglow inc.はWebプロモーションとマーケティングオートメーションを2軸とした名古屋本社のデジタルマーケティング専門会社です。一般的なWeb広告運用会社さんは広告運用に主軸をおきますが、当社はあくまでWebプロモーション。クライアントのソリューションに合わせて、Webライター、カメラマンを使い、オリジナルコンテンツを設計する。更にそこへの誘導導線も築き、ここから初めて運用検証、改善フェーズに入る。またマーケティングオートメーション領域では導入支援はもちろん、導入後、広告施策と合わせたキャンペーン設計までWebプロモーション×マーケティングオートメーションを一気通貫で行います。
プロモーションとしてのデジタルマーケティングに関するご相談はお気軽にお問い合わせください。
![](https://inglow.jp/wordpress/wp-content/uploads/2019/05/1-1024x550.jpg)