Html/erb => Hamlに変換


はじめに

今年の2月くらいから本格的にプログラミングをはじめて、ここが分かりにくかったな、ここでつまづいたな、こういうのを最初に知りたかったなどなど、同じ境遇の人にも役に立てればと思いまとめてみました。

経緯

執筆時点(2018年4月)では、現場では「ruby on rails」を用いてWebアプリケーションをつくるにあたり、Hamlという記述形式をつかうことがとても多いです(slimをつかうところもあります)。Hamlというのはhtmlを生成するための、マークアップ言語です。htmlより記述量が少なくて済むことと、インデントが厳格なため非常にキレイにシンプルに表現することが可能です。

しかしながら、htmlやerbを基礎として学んできた初学者にとって(自分も含め)、はじめは取っ掛かりにくいと思います。また、最初のうちは特にWebからコードをコピー&ペーストする機会が多いと思いますが、Hamlで書かれていることはごく稀で、書き直さなくてはなりません。そこで、オンライン上で変換できる便利なサイトや、gem、hamlに関するサイトなどをまとめてみました。

HTMLからHAMLに変換 / convert HTML => HAML

htmltohaml

http://htmltohaml.com/

google翻訳のように、左の枠にhtmlをポンっと貼り付けると、右の枠にHamlに翻訳されて表示されます。そのままですね。シンプルで分かりやすいサイトです。

ERBからHAMLに変換 / convert ERB => HAML

AWSM

https://awsm-tools.com/code/html2haml

erbで書かれたファイルも変換できます。オプションのチェックボックスは上にチェックを入れて、すぐ下にある Convert ボタンを押しましょう。オプションはrubyのバージョンの違いによるもので、「:content => "Convert HTML 2 HAML"」は古いハッシュリテラル記法になります。

*gem Haml-rails / erb2haml

gemとは?

参考サイト → Ruby on Rails 初心者必見!パッケージ管理ツール『gem』を徹底解説

Haml-rails  

rails4でviewなどが生成されたときに自動でhamlに変換してくれます。
Haml-rails < 公式ドキュメント >

erb2haml  

既存のHTML/ERB ファイルをコマンド一つでHAMLに一括変換してくれます。逆も可能です。
erb2haml < 公式ドキュメント >

*使い方参考サイト
Rails 4 で Haml を利用する手順
Rails の ERB を Haml に変換する

まとめ HAMLについて、詳しい記述方法など