2018/11/24

Railsで管理画面を自作する

Rails でブログを自作する際に管理画面が必要になったので、自分で実装してみました。(認証の部分で devise を使っています)

今回、以下のような管理画面系の gem は使っていません。
- Rails Admin
- Active Admin
- Typus


手順


  • gem インストール
  • devise の設定
  • 認証機能


gem インストール


Gemfile に以下を追記して、bundle install します。

gem 'devise'



devise の設定



以下のコマンドで devise の設定ファイルを作成

$ rails g devise:install
      create  config/initializers/devise.rb
      create  config/locales/devise.en.yml
===============================================================================


  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. If you are deploying on Heroku with Rails 3.2 only, you may want to set:

       config.assets.initialize_on_precompile = false

     On config/application.rb forcing your application to not access the DB
     or load models when precompiling your assets.

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

       rails g devise:views

ターミナルで言われた通り設定を行う。


Userモデル生成

以下のコマンドで Userモデル生成

$ rails g devise User

生成されたマイグレーションファイルと user.rb を編集します。
今回は、Recoverable と Trackable は必要ないので以下のようにします。

class DeviseCreateUsers < ActiveRecord::Migration
  def change
    create_table(:users) do |t|
      ## Database authenticatable
      t.string :email,              null: false, default: ""
      t.string :encrypted_password, null: false, default: ""

      ## Recoverable
      # t.string   :reset_password_token
      # t.datetime :reset_password_sent_at

      ## Rememberable
      t.datetime :remember_created_at

      ## Trackable
      # t.integer  :sign_in_count, default: 0, null: false
      # t.datetime :current_sign_in_at
      # t.datetime :last_sign_in_at
      # t.string   :current_sign_in_ip
      # t.string   :last_sign_in_ip

      ## Confirmable
      # t.string   :confirmation_token
      # t.datetime :confirmed_at
      # t.datetime :confirmation_sent_at
      # t.string   :unconfirmed_email # Only if using reconfirmable

      ## Lockable
      # t.integer  :failed_attempts, default: 0, null: false # Only if lock strategy is :failed_attempts
      # t.string   :unlock_token # Only if unlock strategy is :email or :both
      # t.datetime :locked_at


      t.timestamps
    end

    add_index :users, :email,                unique: true
    # add_index :users, :reset_password_token, unique: true
    # add_index :users, :confirmation_token,   unique: true
    # add_index :users, :unlock_token,         unique: true
  end
end

models/ user.rb

class User < ApplicationRecord
  devise :database_authenticatable, :rememberable, :validatable
end

編集したら、以下のコマンドを実行

$ rake db:migrate


データをセット

次に、初期データをセットします
(ここでセットしたユーザのみログインできます)

Rails 5.2 以上の場合は、credentials.yml.enc に ログインパスワードをセットして、seeds.rb を以下のように編集します。

# credentials を使っている場合は、password: Rails.application.credentials.email[:password] のような感じで書けます
User.create(email: 'mailアドレスを入力してください', password: 'パスワードを入力')

編集したら、以下のコマンドでデータ生成

$ rake db:seed



認証機能


今回は、post モデルを管理します。
( ログインしているユーザだけ、投稿や削除が行えるようにする)

routes 設定

URL が /admin/posts 以下を管理画面としたいので、 routes.rb に以下を追記

namespace :admin do
  resources :posts, only: [:index, :new, :create, :edit, :update, :destroy]
end


controller, view 作成

controllers に admin/posts.rb を作成

class Admin::PostsController < ApplicationController
  # ログインしていない場合は、ログイン画面へ
  before_action :authenticate_user!

  def index
  end

  def new
  end

  def create
  end

  def edit
  end

  def update
  end

  def destroy
  end
end


views に admin/posts/index.html.erb などを作成

あとは、投稿一覧や投稿画面を実装すれば完成です。