enjoy Railsway!! 第3回 テンプレートエンジンの選択肢

RailsアプリケーションでHTML等の出力を記述するView。
デフォルトではテンプレートエンジンとしてembedded Ruby(ERB)が使用されています。
これは一般的なHTMLのタグ記述に近い形でRubyのコードを埋め込むことができます。
HTMLの知識があればとっつきやすい一方、以下のような問題を抱えることがあります。

• 記述量が多くなる
• Rubyのコードが埋もれてしまいわかりにくくなる
• 編集しているうちにHTMLタグの入れ子がおかしくなる

これらを避けた効率的なViewの記述を目的として、実務ではERBとは異なるテンプレートエンジンを利用することが多々あります。
今回はそういった選択肢をご紹介します。
ERBでScaffoldしたViewと、他のテンプレートエンジンに書き換えたViewを示しますので比較してみましょう。

embedded Ruby (eRuby, ERB)

まずはデフォルトであるERBです。

_user.html.erb

<div id="<%= dom_id user %>">
  <p>
    <strong>Name:</strong>
    <%= user.name %>
  </p>
  <p>
    <strong>Email:</strong>
    <%= user.email %>
  </p>
</div>

ERBはRails特有の機能、という訳ではなくRubyの標準ライブラリのひとつです。
<%= %>でコードを括ることでHTML中に出力を埋め込むことができます。

HTML abstraction markup language (Haml)

公式サイトには次のように書かれています。

Beautifully DRY, well-indented, clear markup:
templating haiku.

Haml – https://haml.info/

Railsで利用するには、Gemfileにhaml-railsを記述します。

• https://rubygems.org/gems/haml-rails

テンプレートの拡張子は.hamlです。

HamlではHTMLのタグを表現するとき、タグ名の先頭に%を記述します。
出力を埋め込むときは=のあとにコードを記述するか、#{ }でコードを括ります。
タグを入れ子にするときはインデントで表現します。終了タグはありません。

_user.html.haml

%div{id: '#{dom_id user}'}
  %p
    %strong Name:
    = user.name
  %p
    %strong Email:
    = user.email

なおidが固定の場合、%divは省略して#idのように記述できます。

#user_1
  %p
    %strong Name:
    = user.name

ERBに比べると、だいぶ記述量が減り簡潔になりました。
チュートリアルにはより詳しい使い方が掲載されています。

Slim

GitHubのドキュメントには次のように書かれています。

Slim は 不可解にならない程度に view の構文を本質的な部品まで減らすことを目指したテンプレート言語です。
標準的な HTML テンプレートからどれだけのものを減らせるか、検証するところから始まりました。

README.jp.md – https://github.com/slim-template/slim/blob/v5.1.1/README.jp.md

Railsで利用するには、Gemfileにslim-railsを記述します。

• https://rubygems.org/gems/haml-rails

SlimではHTMLのタグを表現するとき、タグ名をそのまま記述します。
出力を埋め込むときは=のあとにコードを記述するか、#{}でコードを括ります。
タグを入れ子にするときはインデントで表現します。終了タグはありません。

テンプレートの拡張子は.slimです。

_user.html.slim

div id='#{dom_id user}'
  p
    strong Name:
    = user.name
  p
    strong Email:
    = user.email

なおidが固定の場合、divは省略して#idのように記述できます。

#user_1
  p
    strong Name:
    = user.name

Hamlよりもさらに記述量が減りました。
ドキュメントにはより詳しい使い方が掲載されています。

まとめ

RailsアプリケーションでViewを記述するときに利用できるテンプレートエンジンとして、ERBとは異なるものをご紹介しました。
Webアプリケーション開発では必修と言えるHTMLに似たERBに比べると、HamlやSlimは学習コストが掛かることは事実です。
一方で簡潔な記法は書きやすく、文法的に誤ったHTMLを記述することも無くなるため、バグの軽減につながります。
ERBと他のテンプレートエンジンは共存することができます。他のテンプレートエンジンを使ったことがない方は、是非まずお試しいただき、ご自身にあったテンプレートエンジンを選択していただければと思います。

著者/文責: 泉 隼人
・Rails技術者認定試験運営委員会 テクニカルアドバイザー
・鹿児島県 喜界島出身。10歳の頃N88-BASICに触り、コンピューティングにのめり込む
・興味の赴くまま様々なプラットフォーム、言語を楽しみつつ10数年来に渡りRuby on Railsでの開発業務に従事する
・Webサイト https://9uelle.jp/

お知らせ

当委員会ではRails試験を全国300か所で一年中実施をしています。興味がある方は以下をご覧の上、是非受験ください。https://railsce.com/exam