SlideShare a Scribd company logo
1 of 20
Rails 管理画面作成 plug-in
        typus 解説
管理画面って何よ?



案件の管理をする側のみが閲覧、変更をする必
要があるデータを管理する機能をまとめた画面
しばしば、というか普通ユーザーの見えている
画面に劣らない数の画面数になる
管理画面に求められる機能
●   データの検索、閲覧、作成、修正、削除等
●   管理をする必要がある種類のデータの数だけ
    これを作る。正直テンプレ作業で結構面倒く
    さい
●   開発開始時に早めに作っておくと、テスト
    データの作成等でも力を発揮する
●
問題点
●   案件のリリース後、営業サイドから、度々カ
    スタマイズを求められるようになる
●   機能を共通化しすぎると後で困る
管理画面開発の経験則
単純な機能は案件初期からパパっと作れてあ
とでカスタマイズがきちんと出来る
これが管理画面系の plug-in としての理想形
だ
とくに入力フォーム、検索フォームに関して
はどんな要望にも答えられないといけない
管理画面系 plug-in
●   代表的な管理画面系 plug-in 3つ上げてみた
●   active_admin
●   rails_admin
●   typus

●   今回は typus を選んだ理由と使い方の紹介
typus の使い方
●   あまり長い解説はしないのですが
●   「 rails g typus 」で必要なファイルを生成
●   テーブルの情報を読み取って yml ファイルを
    書き出す
表示、編集項目のカスタマイズ
   ●   「 config/typus/ 」以下に作成された YAML
       ファイルを編集すれば表示項目を変えられる
Restaurant:              index アクションで表示したい項目
 fields:
   default: name, image, public, address, phone_number
   form: name, image, public, distinct_id, food_genre_id, address,
phone_number, comment
 relationships: menus
 application: Application    New,edit アクションで編集したい項目


 基本、 deefault や form の項目にあるカラムを編集するだけ
フォームの形式の編集
●   typus デフォルトの view をオーバーライドす
    る
●   「 (typus の gem のあるディレクト
    リ )/app/views/admin/resources 」にある
    「 _form.html.erb 」ファイルをコピー
    編集すると見た目が変わる
さらにカスタマイズ
●   /app/views/admin/resources に
●   index.html.erb
●   new.html.erb
●   edit.html.erb
●   ここらへんを編集
typus の利点
    コードを追いかけていくと
●   helper 関数→ partial→helper 関数→ partial の構
    造が徹底されてる
    partial で呼び出しているファイルをオーバー
    ライドすることで必ずカスタマイズ可能
機能の変更
●    システム管理者には全ユーザー情報の閲覧権限があるけ
     ど、一般の管理者には権限に応じた範囲しか見せないとき
●    Action の機能を上書き可能なので
●    「 app/admin/(table 名 )_controller.rb 」を編集

class HogeController < Admin::ResourceController
    def index
     super
     if admin_user.role!="admin"
       @items = @items.where( " priority < 3 " )
     end
    end
end
ログイン機能だけ借りたい
●   typus の Admin::BaseController を継承すれば
    良いだけです!
●   rails g controller hoge
●   vi で
●   class HogeController < ApplicationController
●                       ↓
●   class HogeController < Admin::BaseController
デザインの編集
●   小さい機能変更だけなら標準で上書き用の
    シートの隙間が用意されています
●   「 app/assets/stylesheets/typus/cuctom.css 」を
    作成して、そこに上書き用のデザインを書け
    ばいいだけ
●
やっておいた方がいい事
●   国際化がまだ不十分で、日本語にするとおか
    しな箇所が出る
●
対応言語の追加
ユーザーの使用言語に日本語を追加する
(rails のルートディレクトリ以下 )lib/typus.rb とかを作って、
以下のコードをコピペ

# encoding: utf-8
module Typus
 module I18n
   class<< self
    alias :old_available_locales :available_locales
    def available_locales
      self.old_available_locales.merge( " 日本語 " => "ja")
    end
   end
 end
end
モデル名の複数形化防止
●   日本語に翻訳しても無理やり複数形に変えるところがある
    ので view で「ユーザー s 」とか「アイテム s 」とか表示さ
    れる
●   /app/views/admin/resources を app/views にコピーして view
    ファイルの pluralize メソッドを grep で見つけて削っておく
typus の欠点
●   テーブルの変更にすごく弱い(特にカラム名
    変更と、カラム削除)ここは最悪
    (railg g typus コマンドにモデル名指定のオプションが欲しい所 )

    config/typus/ テーブル名 .yml を再編集、また
    は生成しないといけない
●   mongodb だと管理機能自動生成できない(あ
    る意味当たり前)
結論
●   Typus の最大の利点はカスタマイズ方法の幅
    広さと簡潔さ
●   最大の欠点は migration に弱い、代表的な
    gem 3つでダントツで弱い(はず…)
ありがとうございました

More Related Content

Similar to rails 管理画面作成gem Typus解説

2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料OCHI Shuji
 
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティスeZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティスericsagnes
 
iOSやAndroidアプリ開発のGoodPractice
iOSやAndroidアプリ開発のGoodPracticeiOSやAndroidアプリ開発のGoodPractice
iOSやAndroidアプリ開発のGoodPracticeKen Morishita
 
WTM53 phpフレームワーク いまさらcodeigniter
WTM53 phpフレームワーク いまさらcodeigniterWTM53 phpフレームワーク いまさらcodeigniter
WTM53 phpフレームワーク いまさらcodeigniterMasanori Oobayashi
 
Intalio japan special cloud workshop
Intalio japan special cloud workshopIntalio japan special cloud workshop
Intalio japan special cloud workshopDaisuke Sugai
 
eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」
eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」
eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」ericsagnes
 
Java fx勉強会lt 第8回
Java fx勉強会lt 第8回Java fx勉強会lt 第8回
Java fx勉強会lt 第8回Taiji Miyabe
 
Angular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェストAngular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェストMasahiko Asai
 
React es2015
React es2015React es2015
React es2015t-onizawa
 
ASP.NET MVC 2 ~新機能の紹介~
ASP.NET MVC 2 ~新機能の紹介~ASP.NET MVC 2 ~新機能の紹介~
ASP.NET MVC 2 ~新機能の紹介~Yoshitaka Seo
 
Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編
Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編
Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編Daizen Ikehara
 
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力ThinReports
 
中・大規模サイト作成業務フロー
中・大規模サイト作成業務フロー中・大規模サイト作成業務フロー
中・大規模サイト作成業務フローsenakamura
 
The Abstract Architecture of Applications
The Abstract Architecture of ApplicationsThe Abstract Architecture of Applications
The Abstract Architecture of Applicationsshundroidk
 
大規模なJavaScript開発の話
大規模なJavaScript開発の話大規模なJavaScript開発の話
大規模なJavaScript開発の話terurou
 
MediaWiki Tips for saveMLAK - wikibana
MediaWiki Tips for saveMLAK - wikibanaMediaWiki Tips for saveMLAK - wikibana
MediaWiki Tips for saveMLAK - wikibananinomy
 

Similar to rails 管理画面作成gem Typus解説 (20)

2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料2012 05-19第44回cocoa勉強会発表資料
2012 05-19第44回cocoa勉強会発表資料
 
Djangoのススメ
DjangoのススメDjangoのススメ
Djangoのススメ
 
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティスeZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
eZ Publish 2012年4月勉強会 - eZ Publish設計ベストプラクティス
 
iOSやAndroidアプリ開発のGoodPractice
iOSやAndroidアプリ開発のGoodPracticeiOSやAndroidアプリ開発のGoodPractice
iOSやAndroidアプリ開発のGoodPractice
 
WTM53 phpフレームワーク いまさらcodeigniter
WTM53 phpフレームワーク いまさらcodeigniterWTM53 phpフレームワーク いまさらcodeigniter
WTM53 phpフレームワーク いまさらcodeigniter
 
2013 Ignite UI 最新情報 in 岡山
2013 Ignite UI 最新情報 in 岡山2013 Ignite UI 最新情報 in 岡山
2013 Ignite UI 最新情報 in 岡山
 
Intalio japan special cloud workshop
Intalio japan special cloud workshopIntalio japan special cloud workshop
Intalio japan special cloud workshop
 
eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」
eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」
eZ Publish勉強会2013年3月「eZ Publishの構築を簡単に!」
 
UnicastWS vol.2
UnicastWS vol.2UnicastWS vol.2
UnicastWS vol.2
 
Java fx勉強会lt 第8回
Java fx勉強会lt 第8回Java fx勉強会lt 第8回
Java fx勉強会lt 第8回
 
Angular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェストAngular 4がやってくる!? 新機能ダイジェスト
Angular 4がやってくる!? 新機能ダイジェスト
 
React es2015
React es2015React es2015
React es2015
 
ASP.NET MVC 2 ~新機能の紹介~
ASP.NET MVC 2 ~新機能の紹介~ASP.NET MVC 2 ~新機能の紹介~
ASP.NET MVC 2 ~新機能の紹介~
 
お客様が望んでいるモダンデスクトップアプリとは?/傾向と対策 Part1
お客様が望んでいるモダンデスクトップアプリとは?/傾向と対策 Part1お客様が望んでいるモダンデスクトップアプリとは?/傾向と対策 Part1
お客様が望んでいるモダンデスクトップアプリとは?/傾向と対策 Part1
 
Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編
Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編
Net advantage 2012 volume2 最新情報 Windows Forms / ASP.NET 編
 
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
 
中・大規模サイト作成業務フロー
中・大規模サイト作成業務フロー中・大規模サイト作成業務フロー
中・大規模サイト作成業務フロー
 
The Abstract Architecture of Applications
The Abstract Architecture of ApplicationsThe Abstract Architecture of Applications
The Abstract Architecture of Applications
 
大規模なJavaScript開発の話
大規模なJavaScript開発の話大規模なJavaScript開発の話
大規模なJavaScript開発の話
 
MediaWiki Tips for saveMLAK - wikibana
MediaWiki Tips for saveMLAK - wikibanaMediaWiki Tips for saveMLAK - wikibana
MediaWiki Tips for saveMLAK - wikibana
 

More from baban ba-n

Typusとadministrateを比較してみよう
Typusとadministrateを比較してみようTypusとadministrateを比較してみよう
Typusとadministrateを比較してみようbaban ba-n
 
ハッカソン。来た、見た、負けた! Spajam2016仙台予選
ハッカソン。来た、見た、負けた! Spajam2016仙台予選ハッカソン。来た、見た、負けた! Spajam2016仙台予選
ハッカソン。来た、見た、負けた! Spajam2016仙台予選baban ba-n
 
ガラホ、なるものに対応してきた
ガラホ、なるものに対応してきたガラホ、なるものに対応してきた
ガラホ、なるものに対応してきたbaban ba-n
 
Minitest調べてみた
Minitest調べてみたMinitest調べてみた
Minitest調べてみたbaban ba-n
 
人工言語ロジバン超入門編
人工言語ロジバン超入門編人工言語ロジバン超入門編
人工言語ロジバン超入門編baban ba-n
 
普通のエンジニアが【ロジバン】やってみた
普通のエンジニアが【ロジバン】やってみた普通のエンジニアが【ロジバン】やってみた
普通のエンジニアが【ロジバン】やってみたbaban ba-n
 
プログラミング言語Cyanの紹介
プログラミング言語Cyanの紹介プログラミング言語Cyanの紹介
プログラミング言語Cyanの紹介baban ba-n
 
Rubyのコードを読んでみよう(オブジェクト編)
Rubyのコードを読んでみよう(オブジェクト編)Rubyのコードを読んでみよう(オブジェクト編)
Rubyのコードを読んでみよう(オブジェクト編)baban ba-n
 
Rubyのソースコードを読んでみよう(入門編)
Rubyのソースコードを読んでみよう(入門編)Rubyのソースコードを読んでみよう(入門編)
Rubyのソースコードを読んでみよう(入門編)baban ba-n
 
名前重要 超重要
名前重要 超重要名前重要 超重要
名前重要 超重要baban ba-n
 
Rails-Plugin Flexturesの紹介
Rails-Plugin Flexturesの紹介Rails-Plugin Flexturesの紹介
Rails-Plugin Flexturesの紹介baban ba-n
 

More from baban ba-n (11)

Typusとadministrateを比較してみよう
Typusとadministrateを比較してみようTypusとadministrateを比較してみよう
Typusとadministrateを比較してみよう
 
ハッカソン。来た、見た、負けた! Spajam2016仙台予選
ハッカソン。来た、見た、負けた! Spajam2016仙台予選ハッカソン。来た、見た、負けた! Spajam2016仙台予選
ハッカソン。来た、見た、負けた! Spajam2016仙台予選
 
ガラホ、なるものに対応してきた
ガラホ、なるものに対応してきたガラホ、なるものに対応してきた
ガラホ、なるものに対応してきた
 
Minitest調べてみた
Minitest調べてみたMinitest調べてみた
Minitest調べてみた
 
人工言語ロジバン超入門編
人工言語ロジバン超入門編人工言語ロジバン超入門編
人工言語ロジバン超入門編
 
普通のエンジニアが【ロジバン】やってみた
普通のエンジニアが【ロジバン】やってみた普通のエンジニアが【ロジバン】やってみた
普通のエンジニアが【ロジバン】やってみた
 
プログラミング言語Cyanの紹介
プログラミング言語Cyanの紹介プログラミング言語Cyanの紹介
プログラミング言語Cyanの紹介
 
Rubyのコードを読んでみよう(オブジェクト編)
Rubyのコードを読んでみよう(オブジェクト編)Rubyのコードを読んでみよう(オブジェクト編)
Rubyのコードを読んでみよう(オブジェクト編)
 
Rubyのソースコードを読んでみよう(入門編)
Rubyのソースコードを読んでみよう(入門編)Rubyのソースコードを読んでみよう(入門編)
Rubyのソースコードを読んでみよう(入門編)
 
名前重要 超重要
名前重要 超重要名前重要 超重要
名前重要 超重要
 
Rails-Plugin Flexturesの紹介
Rails-Plugin Flexturesの紹介Rails-Plugin Flexturesの紹介
Rails-Plugin Flexturesの紹介
 

Recently uploaded

AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdfAWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdfFumieNakayama
 
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)UEHARA, Tetsutaro
 
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineerYuki Kikuchi
 
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdfクラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdfFumieNakayama
 
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?akihisamiyanaga1
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NTT DATA Technology & Innovation
 
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)Hiroshi Tomioka
 
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...博三 太田
 

Recently uploaded (8)

AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdfAWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
AWS の OpenShift サービス (ROSA) を使った OpenShift Virtualizationの始め方.pdf
 
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
デジタル・フォレンジックの最新動向(2024年4月27日情洛会総会特別講演スライド)
 
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
自分史上一番早い2024振り返り〜コロナ後、仕事は通常ペースに戻ったか〜 by IoT fullstack engineer
 
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdfクラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
クラウドネイティブなサーバー仮想化基盤 - OpenShift Virtualization.pdf
 
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
CTO, VPoE, テックリードなどリーダーポジションに登用したくなるのはどんな人材か?
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
 
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
 
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察  ~Text-to-MusicとText-To-ImageかつImage-to-Music...
モーダル間の変換後の一致性とジャンル表を用いた解釈可能性の考察 ~Text-to-MusicとText-To-ImageかつImage-to-Music...
 

rails 管理画面作成gem Typus解説