いぬれおがんばれお

がんばる日記です

Railsのviews配下にある.erbファイルをslimに変換する

現在の業務で行っているプロジェクトでは、コーディングをデザイナーさんにやっていただいていたのでerbを使っています。しかしhtmlって長いよね、閉じるの面倒だよね、ということでslimに移行することにしました。(レンダリング時間が一番速いしね!)

デザイナーさんも新しいこと覚えたい!と前のめりだったので、取り敢えず現状のerbをslimに変換する方法を探す。

導入まで

サクーっと検索するとerbからhaml、そしてhamlからslimに変換する方法がよく出てきました。エントリを読んでみると変換途中でトラブルが起こるみたいだったので、なんとか一括で変換できるものがないか探してみるとやっぱりありました。

コミットログを見てみると2013/4にファーストバージョンがコミットされ、昨年末から活発になってきている模様です。

GitHub: slim-template/html2slim

参考サイト: Railsのviewsディレクトリ以下の.erbファイルをSlimに一括変換するgem (html2slim) とワンライナー記述 | もっちブログ 3/3 Slimテンプレートエンジンを使ってHTMLを出力する [Ruby] All About

いざ導入

コンバート

参考サイトに沿って進めていきます。projectにいれるのではなくローカルにhtml2slimをインストールします。

$ gem install html2slim

無事に入ったと思ったらcommand not found、、下記を試す

$ rbenv exec gem install html2slim

はいった!bundlerを雰囲気で使ってるのでここらへんはちゃんと調べてブログにまとめます。

$ rbenv exec html2slim -h
Usage: html2slim INPUT_FILENAME_OR_DIRECTORY [OUTPUT_FILENAME_OR_DIRECTORY] [options]
        --trace                      Show a full traceback on error
    -d, --delete                     Delete HTML files
    -h, --help                       Show this message
    -v, --version                    Print version

rbenv execも外してOK

$ html2slim -h
Usage: html2slim INPUT_FILENAME_OR_DIRECTORY [OUTPUT_FILENAME_OR_DIRECTORY] [options]
        --trace                      Show a full traceback on error
    -d, --delete                     Delete HTML files
    -h, --help                       Show this message
    -v, --version                    Print version

参考サイトにのっているワンライナーだとactive_admin、deviseを使っている場合ディレクトリが深い部分もあるので別のサイトのものを使用。(rbenvの部分はbundleなどに変更してみてくださいね)

find app/views -name "*.erb" -exec bundle exec erb2slim {} \;

こんな感じに!

f:id:inureo:20140808193904p:plain

コンバート後の対応

  • style記述に対応していない
  • scriptタグに対応していない
  • styleタグに対応していない
  • if、unlessのインデントがズレる

ある程度まではコンバートしてくれるのですが、上記の点で手直しが必要になります。

またslimの記述で角カッコでアトリビュートを囲う方法があるのですが、個人的には閉じ忘れが面倒になるので全て角カッコを抜いて下記のような形にしました。

h1 class="heading"

ザックリとですが備忘録的なメモです!

slimのREADME.md日本語訳 slim/README.md at README_ja · yterajima/slim

GitHub searchを使ってイケてるしヤバいメソッド名をつけよう!

コードレビューの中で「メソッド名がダサい」と、指摘をいただいた際に参考になるよと教えてもらった方法です。

GitHubのSearchを使う

Code Search

恥ずかしながら上記ページを知らなかったのですが、ここからパブリックなプロジェクト内の検索ができるようです。こちらを使って14.7Mもあるレポジトリの中からメソッド名の参考になるものを探してみましょう。

1. searchしたい部分を入力

f:id:inureo:20140806204655p:plain

rubyのmapを使ったソースがみたいなー、ということでmapで検索をします。たくさん出た!けどレポジトリ名での検索になってしまっているので、code検索に切り替えます。

2. codeを選択

f:id:inureo:20140806204709p:plain

code検索に切り替わったのですが、たくさんの言語が混ざっているのでサイドメニューのLanguagesの中から更に言語を選択します、ここではRubyを選択します。

3. 言語を選択

f:id:inureo:20140806204716p:plain

なんとなく…ぽくなってきた…?

検索内容がザックリすぎたので、もう少し詳細を入れて調べてみます。

より詳しい内容で検索

f:id:inureo:20140806204722p:plain

map(&:id)

で、idだけを抽出するメソッドの名前がほしーい!ということで画像を見るとids!

User.ids、実にオブジェクト指向な感じ。

簡単な例だったので参考になるかはわかりませんが、検索するならGitHubでの検索が一番数が多いと思うので備忘録的にブログを書きました。何かの参考になれば幸いです。

ちなみにメソッド名関連で調べてみると、CRUDを頭につけるとわかりやすいよねーとかあるので、ひとまずはそこらへんを参考にして、飛び道具的なメソッドが出てきたらGitHub Searchを使ってみるつもりです!

更に余談ですが下記エントリを見るとめちゃくちゃ勉強になりそうなので見て勉強してみることにします。

正しいコーディングが身につくエンジニア英語の手引き 〜文法とクラス/メソッド、命名規則〜 | Find Job ! Startup