SIS Lab
>
Blog
>
テンプレートエンジン？eRuby、Haml/Sass、Slimってなによ？

テンプレートエンジン？eRuby、Haml/Sass、Slimってなによ？

更新日:2018.07.28 作成日:2011.12.15

#Ruby

いろいろ紛らわしい、名前が多いから調べてみた。

eRubyって？

JavaでいうJSP, それがRubyだとeRuby

eRuby: 任意のテキストファイルに Ruby スクリプトを埋め込む書式の仕様
eruby: 前田修吾さん作の eRuby の C による実装
ERB: 関将俊さん作の eRuby の Ruby による実装
ERb: ERB が標準添付になる前のバージョン (ERb と ERbLight があった)

標準添付ライブラリ紹介【第 10 回】 ERB

Haml/Sassって？

Haml

HamlはHTMLを生成するためのマークアップ言語。

#profile
  .left.column
    #date= print_date
    #address= current_user.address
  .right.column
    #email= current_user.email
    #bio= current_user.bio

#haml

Sass

SassはCSSを生成するためのメタ言語。

$blue: #3bbfce
$margin: 16px

.content-navigation
  border-color: $blue
  color: darken($blue, 9%)

.border
  padding: $margin / 2
  margin: $margin / 2
  border-color: $blue

Slimって？

Hamlをもっと簡潔にしたもの。みたい。

doctype html
html
  head
    title Slim Core Example
    meta name="keywords" content="template language"

  body
    h1 Markup examples

    div id="content" class="example1"
      p Nest by indentation

      == yield

      - unless items.empty?
        table
          - for item in items do
            tr
              td = item.name
              td = item.price
      - else
        p
         | No items found.  Please add some inventory.
            Thank you!

    div id="footer"
      | Copyright 〓 2010 Andrew Stone

    = render 'tracking_code'

    javascript:
      $(content).do_something();