【Railsでアプリ開発中】プログラミング初心者の勉強ブログ #49
Gem「rails_admin」で実装した管理画面が、アプリリリース後のユーザー管理や利用状況を確認するにあったて、思ったより便利だったので使い方についてまとめます。
はじめに
この記事は、railsフレームワークでオリジナルwebアプリ「免許学科試験学習サイト」作成中の僕が、プログラミングをしている中で気づいたことや学んだことを書いております。プログラミング初心者なので知識は少ないですが、現在通っているプログラミングスクール「DIVE INTO CODE」で学んでいることや、ネットで見つけた様々な記事を参考に記事を作成しております。
目次
[toc]
管理画面はどんなものか
rails_adminの管理画面とは
rails_adminで管理画面を実装すると、「ブラウザ」上でモデルやテーブルの中身の状況を確認・操作できます。通常「コンソール」で確認・操作するDB関連の事柄を、管理権限を付与されたユーザーは、ブラウザで行うことができるようになります。開発環境だったら「localhost:3000/admin」のように、ホームのURLの後ろに「/admin」をつけると開くことができます。
実際の見た目
このぱっと見Bootstrap多様されてる感じの画面がrails_adminで実装した「管理画面」です。ホーム画面であるダッシュボードを載せてます。ちなみにこれは今作成している「免許問題アプリ」の管理画面です。
ダッシュボードでは各モデルとレコード数がすぐ確認できます。この画面で目立つのは「Question」の「810」だと思いますが、免許の問題が現在questionsテーブルに810問入っているよ、ということになります。
どんなことができるのか
レコードの新規作成、編集、削除
最初に書いた通り、通常「rails c」してコンソール上で行うデータベース関連の操作（レコードの新規作成、編集、削除）を全てブラウザ上で行うことが可能です。下の画像は管理画面の「ユーザー」をクリックし、タブの「新規作成」を選択したときの画面です。
このように入力画面が表示され、ブラウザ上でラクに登録できます。deviseで指定したユーザーモデルだけでなく、他のモデルも可能です。また、本番環境でも同じことができるのも便利です。
ユーザー情報の検索
レコードの作成、変更、登録ができるだけでなく、レコードの検索もできます。メソッドで言ったら「.find」や「.where」と同じことができます。例えば、性別カラムを作成したとしてユーザーの中から「男」を検索する場合、
上の画像の通り「男」と入れて更新すれば、
男が3人いることがわかります。数が少ないのでなんとも言えない結果ですが、とにかくユーザー属性（年齢や性別）ごとに検索をかけることができます。
またカラムから絞り込むことも可能です。Questionモデルをカラムの条件から抽出します。
「Question」をクリックし、右の「絞り込む」を見ると、Questionモデルのカラムがプルダウンメニューで表示されます。今回は「id」を選択し、左の「更新」をクリックします。
すると、下の画像のように「id」に関するテキスト入力画面が出てきます。セレクトボックスで「Between and」を指定し、「id」が30〜60の問題を抽出してみます。
ちゃんと30から60まで問題が表示されます。この検索は複数条件も指定可能です。次に「絞り込む」からanswerを選択し、答えがtrue（○×問題なのでtrueだとその問題の答えは○）のものを抽出します。
しっかり複数条件にマッチした問題だけ引っ張ってくれます。idが30〜60の問題のうち、答えが「○」の問題は11問あることがわかります。
以上のようにデータベース上の操作ほとんどすべてブラウザ上のGUI操作で行うことができます。Railsでアプリリリースした際にrails_adminをとりあえず実装し、カラムさえ作ってユーザー情報取得しておけば、ある程度の顧客分析が可能です。コスパ悪くないんじゃないかなって思います。
rails_adminでの管理画面実装方法
実際にrailsアプリに実装する手順です。流れとしては、
- 2種類のGemをインストール
- 管理者権限の設定
- すでに登録しているユーザーに管理者権限を付与
- 管理者ログイン時の「/admin」へのリンク設置、日本語化などの環境整備
になります。
2種類のGemをインストール
1つは「rails_admin」、管理画面を生成するGemです。
そしてもう1つは「cancancan」。管理者権限の設定を行うためのGemです。変な名前ですね。
rails_adminのインストール
以下のリンク参照。
[blogcard url=”https://github.com/sferik/rails_admin”]
README.mdのインストール方法部分を抜粋した画像↓
- 自分のrailsアプリのgemfileに、「gem ‘rails_admin’, ‘~> 1.3’」と追加で書く。
- ターミナルで「bundle install」
- ターミナルで「rails g rails_admin:install」
- 求められたらnamespaceをルーティングにつける（/adminのルート名が何かしらと被ってたとき。）
- ターミナルで「rails s」してサーバーを立ち上げて、URL末尾に「/admin」を追加して表示。
ここまでやると、開発環境だったら「localhost:3000/admin」のURLで管理画面ダッシュボードが表示されます。
cancancanのインストール
次に「cancancan」です。以下のリンク参照。
[blogcard url=”https://github.com/CanCanCommunity/cancancan”]
README.mdのインストール方法部分を抜粋した画像↓
- 自分のrailsアプリのgemfileに、「gem ‘cancancan’, ‘~> 2.0’」と追加で書く。
- もし自分のrailsバージョンが「4.2」より古いものを使っていた場合は「gem ‘cancancan’, ‘~> 1.10’」と書く。
- ターミナルで「bundle install」
※自分のrailsのバージョンはターミナルで「rails -v」で確認可能です。
管理者権限の設定
cancancanでabilityを生成
ターミナルで「$ rails g cancan:ability」を実行しモデルを生成します。
生成された「models/ability.rb」を編集
以下のように編集します。
model/ability.rb
class Ability
include CanCan::Ability
def initialize(user)
if user.try(:admin?)
can :access, :rails_admin
can :manage, :all
end
end
end
「管理者権限が付与されているユーザー」に「管理画面（rails_admin）へのアクセス」と「全てのモデルに対しての全ての操作（新規保存、編集、削除など）」を許可する設定です。
生成された「config/initializers/rails_admin.rb」を編集
こちらも以下のように編集します。
config/initializers/rails_admin.rb
RailsAdmin.config do |config|
### Popular gems integration
## == Devise ==
config.authenticate_with do
warden.authenticate! scope: :user
end
config.current_user_method(&:current_user)
## == Cancan ==
config.authorize_with :cancan
## == Pundit ==
# config.authorize_with :pundit
~(省略)~
end
end
「Devise」と「Cancan」のコメントアウトされている箇所を外すだけです。
すでに登録しているユーザーに管理者権限（admin: true）を付与
１からユーザーを作成することも出来なくはないですが、ここではすでにDBに保存されているユーザーデータに対して管理者権限を付与していきます。
管理者を識別するための属性を追加
ユーザーが管理者であるかどうかをコンピュータが判断するためにUserモデルに「admin」カラムをBoolean値（trueかfalse）で追加し、trueを持っているユーザーが管理者であると設定します。
そのためにまず、ターミナルで「$ rails g migration add_column_to_users」を打ち込み、生成されたマイグレーションファイルを使ってusersテーブルに「admin」カラムを追加します。このとき「default: false」を必ず付け、通常のユーザー登録の際は管理者権限なしを設定しておきます。
class AddColumnToUsers < ActiveRecord::Migration[5.1]
def change
add_column :users, :admin, :boolean, default: false
end
end
上のように書いたら、 「$ rails db:migrate」を忘れずに行います。
schema.rbを確認し、usersテーブルに「admin」カラムがあれば成功です。
すでに登録されているユーザーに権限付与する
こちらはターミナルで行います。「$ rails c」してコンソールを開き、
$ rails c [1] pry(main)> user = User.find(3) [2] pry(main)> user.update_attribute :admin, true
このような形で書き込むことで付与できます。上の場合idが3のユーザーに対して、「admin」をtrueに変更する処理を行なっています。
これでユーザーidが3番の方は管理画面へアクセスする権限を得ることになります。
管理者ログイン時の「/admin」へのリンク設置、日本語化などの環境整備
最後ですが実際に管理画面を使いやすいように環境を少し整えます。
管理者ログイン時のみ表示されるリンク設置
場所はどこでも良いのですが、僕の場合「users/show.html.erb」のマイページ画面に設置しました。
users/show.html.erb
<% if current_user.try(:admin?) %>
<div class="page-header">
<h1>管理者マイページ</h1>
</div>
<p class="admin_btn col-xs-offset-1 col-xs-10 col-xs-offset-1"><%= link_to "管理画面", "/admin" %></p>
<% else %>
<div class="page-header">
<h1>マイページ<br>
<small><%= current_user.name %>さん、こんにちは！</small>
</h1>
</div>
<p>マイページでは学習進捗を確認できます。<br>
自分の学習進捗に合わせてカリキュラムを選んでください。
</p>
<% end %>
<% if current_user.try(:admin?) %><% end %>で囲むことで、その範囲のHTML表示を条件分岐をします。
「if current_user.try(:admin?)」は管理者権限を持ったユーザーがログインしている際にtrueを返すメソッドです。「current_user」メソッドはdeviseのデフォルトメソッドなので、deviseを使ってない場合はusersコントローラーでログインユーザーのidを取得して渡す必要があります。「@user = User.find( params[:id] )」等でログインユーザーをインスタンス変数に格納してください。この場合HTMLで「@user.id.try(:admin?)」で行けると思います。
※tryを間に挟んでいるのは「current_user」がnilのときにエラーを出さないためです。
ちなみに表示はこうなります。
【管理者権限なしの場合】
【管理者権限ありの場合】
これでわざわざ直接「/admin」打ち込まなくてもすぐ入れます。
管理者ページの日本語化
管理者ページの日本語化はadminページ専用のymlファイルを作成して対応します。
まず、「config/locales/rails_admin.ja.yml」ファイルを新規作成し、
[blogcard url=”https://gist.github.com/mshibuya/1662352″]
上のリンクから翻訳をコピー、「rails_admin.ja.yml」にペーストして完了です。
※そもそもrailsアプリそのものを日本語設定しないと反映されません。
まとめ
管理者ページみたいな分野ってあんまやる気起きないっていうか、そんなこというとあれですがサボりがちになる部分です。ただ分析ツールとしての利用ができそうなので今回実装をしてみました。
ユーザーがたくさん使ってくれたら管理画面も活きるんですけどね。免許アプリはどうなるかわからないですね。
あともうちょいでリリースできそうです。頑張ります。
以上ありがとうございました。