概要

まっさらな空のディレクトリから、

Railsのアプリを立ち上げて
deviseでユーザー認証機能を導入し
ユーザー情報の項目を追加し
ユーザープロフィール表示ページを追加する

までの手順をまとめる（手順だけ）。サンプルとして、rails scaffoldでシンプルなブログアプリ(devise_app)をつくる。 (2019/10/19 追記) なお、追加したリンク等の翻訳については手順に含まれていないので、適宜翻訳ファイルの修正が必要。

参考資料

本記事は下記のページを元にして手順を捕捉したものである。
devise導入からユーザーのプロフィール画面を作成するまで

実施環境

MacOS Mojave10.14.6
Rails 6.0.0
devise 4.7.1
devise-i18n 1.8.2

上記は私が確認した際のバージョンであり、下記手順で実行するとdeviseおよびdevise-18nは最新バージョンがインストールされる。

手順

rails new devise_appする
Gemfileにgem 'devise', gem 'devise-i18n'を追記し、bundleする
rails g scaffold blog title:string content:textする
rails db:migrateする
rails g devise:installする
config/environments/development.rb にconfig.action_mailer.default_url_options = { host: 'localhost', port: 3000 }を追記
config/routes.rb にroot to: "blogs#index"を追記

app/views/layouts/application.html.erb に

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

　　を追記

app/views/blogs/index.html.erbの<p id="notice"><%= notice %></p>を消す
rails g devise userする
rails db:migrateする
rails g devise:i18n:viewsする
rails g devise:controllers usersする
rails g migration AddColumnToUsers name:string profile:textする
rails db:migrateする

app/controllers/application_controller.rbに

  before_action :authenticate_user!
  before_action :configure_permitted_parameters, if: :devise_controller?

  protected
  def configure_permitted_parameters
    devise_parameter_sanitizer.permit(:sign_up, keys: [:name])
    devise_parameter_sanitizer.permit(:account_update, keys: [:name, :profile])
  end

を追記

app/views/devise/registrations/new.html.erbに

  <div class="field">
    <%= f.label :name %><br />
    <%= f.text_field :name, autofocus: true %>
  </div>

を追記

app/views/devise/registrations/edit.html.erbに

  <div class="field">
    <%= f.label :name %><br />
    <%= f.text_field :name, autofocus: true %>
  </div>

  <div class="field">
    <%= f.label :profile %><br />
    <%= f.text_area :profile, autofocus: true %>
  </div>

を追記

app/controllers/application_controller.rbに

  before_action :set_locale

  def set_locale
    I18n.locale = extract_locale_from_tld || I18n.default_locale
  end

  def extract_locale_from_tld
    parsed_locale = request.host.split(".").first
    I18n.available_locales.map(&:to_s).include?(parsed_locale) ? parsed_locale : nil
  end

を追記

app/views/layouts/application.html.erbに

  <%= link_to_if request.host.split('.').first != 'ja', '日本語',   "http://ja.localhost:3000#{request.path}"%> |
  <%= link_to_if request.host.split('.').first != 'en', 'English', "http://en.localhost:3000#{request.path}" %>

を追記

config/routes.rbの最後に
```
  resources :users, only: [:show]
```
を追記

app/controllers/users_controller.rbを新たに作成し

  class UsersController < ApplicationController
    def show
      @user = User.find(params[:id]) #追記
    end
  end

を記述

app/views/users/show.html.erbを新たに作成し

  <h1>Users#show</h1>
  <p>名前 : <%= @user.name %></p>
  <p>メールアドレス : <%= @user.email %></p>
  <p>プロフィール : <%= @user.profile %></p>
  <%= link_to t(".edit_profile"), edit_user_registration_path %>

を記述

app/views/layouts/application.html.erbに

  <p class="navbar-text pull-right">
    <% if user_signed_in? %>
      <%= t(".login_user", username: current_user.email) %>
      <br>
      <%= link_to t(".top"), blogs_path, class: 'navbar-link' %> |
      <%= link_to t(".profile"), user_path(current_user.id), class: 'navbar-link' %> |
      <%= link_to t(".sign_out"), destroy_user_session_path, method: :delete, class: 'navbar-link' %>
    <% else %>
      <%= link_to t(".top"), blogs_path, class: 'navbar-link' %> |
      <%= link_to t(".sign_up"), new_user_registration_path, class: 'navbar-link'  %> |
      <%= link_to t(".sign_in"), new_user_session_path, class: 'navbar-link'  %>
    <% end %>
  </p>

を追記

app/controllers/users/registrations_controller.rb に

  protected
  # アカウント編集後、プロフィール画面に移動する
    def after_update_path_for(resource)
      user_path(id: current_user.id)
    end

を追記

config/routes.rbのresources :users, only: [:show]より上に

  devise_for :users, controllers: {
    registrations: "users/registrations"
  }

を追記

最後に

解説は後日！！！

自分にやさしく学ぶプログラミング

プログラミング学習記録、備忘録

Ruby on Rails : deviseでユーザー認証追加してi18nしてユーザープロフィールページも追加するための手順（手順だけ）

概要

参考資料

実施環境

手順

最後に