2番煎じどころか100番煎じくらいだと思いますが、Ruby on Rails+Deviseで認証機能付きTodoアプリを作ってみました。

今回やることは以下です。

  • Railsアプリのプロジェクトを作成
  • Deviseインストール&設定
  • 各種モデル作成+マイグレーション
  • ルーティング設定
  • コントローラ作成
  • メール送信設定
  • Herokuアプリ作成+設定+デプロイ

Rubyのバージョンは2.2.4、Railsは5.0.0.1です。

Railsアプリのプロジェクト作成

雛形となるプロジェクトを以下のコマンドで作成(rails newはジェネレータなコマンド)

Railsにユーザ認証機能を追加してくれるDevise、環境変数を良い感じに操作できるDotEnv、PostgreSQL用のライブラリpgをGemfileに追加してインストール

パス指定してインストール(システムのgemに影響を与えない)

Deviseのインストール&設定

Devise用のファイルをジェネレータで作成

表示される注記の通りに変更する

config/environments/development.rbは以下を追加。アクティベーションのリンク等、認証系のメールに記載されるURLを設定しています。

ホーム画面のコントローラ(home)+メソッド(index)を作成してルーティングを追加

config/routes.rbに以下を追記

全ビューに適用されるテンプレートに、flash messageを追加

Devise用のビューをカスタマイズするために、Deviseのviewファイルをジェネレータで作成

Devise用のユーザモデルを作成

Deviseの機能をフルで使うので、コメントアウトを解除

とりあえず、database.ymlはsqlite3のままでマイグレーション

Userモデルのコメントアウトも解除しておく

sqlite3の確認はDB Browser for SQLiteを使うと良い

ルーティングの確認は以下のコマンドで

出力こんな感じ。色々とできています。

この時点でDevise部分は確認可能なので、一旦Appサーバ立ち上げて確認

http://localhost:3000/users/sign_upでサインアップできることを確認する

タスク用CRUD画面の作成

まずはモデルを作成

マイグレーションファイルはこんな感じで。Userモデルと紐付けて管理するので、user_idをIntegerで定義しています。

項目定義したのち、マイグレーション

Userモデルクラス、Taskモデルクラスにアソシエーションの設定をする

Taskモデル↓

次にタスクCRUD画面のコントローラ+メソッドを作成

中身はこんな感じで。ユーザに紐づくTaskを取得したり、before_actionでDeviseの認証ヘルパーを噛ませてます。

ビューはこんな感じで

app/views/tasks/index.html.erb

app/views/tasks/edit.html.erb

app/views/tasks/new.html.erb

app/views/tasks/show.html.erb

config/routes.rbに以下を追加

そうすると以下のようなルーティングが自動的に実装される

本番環境用にconfig/database.ymlを設定(Herokuにデプロイする場合は、環境変数DATABASE_URLを見てくれるのでクレデンシャルの設定は環境変数に任せればOK)

Herokuのアプリ作成+設定

config/environments/production.rbに以下を追加

SendGridのメール設定

以下のコマンドでSendGridのHerokuの環境変数(=Addonで割り当てられたSendGridのクレデンシャル)を抽出する。

config/environment.rbに以下を追記

ローカル開発でもSENDGRID使う場合は以下のように.envファイルをアプリケーションのルートに設置

Herokuにデプロイ

ハマりの備忘

【事象】以下のsign_outのリンククリックでActionController::InvalidAuthenticityTokenのエラーになる

【原因】csrfのメタタグが入っていないだけだった(なぜか削除していた)

method: :deleteを設定するとjQueryでAjax通信するが、そのなかでmeta[]要素を取得できずエラーになっていた