Haml Walkthrough: ERB

Now we’re going to walk you through the exact same process with which Haml was created. A well-formatted bit of HTML was changed step by step until Haml was born.

Let’s start with an example using ERB. It’s a standard template you might find in any Ruby project. Don’t panic if you aren’t a Rubyist—it’s a straightforward example.

 <div id=​"products"​>
 <​%- @products.each do |product| %>
  <div class=​"product"​ id=​"product_<%= product.id %>"​>
  <div class=​"name"​>​<​%= product.name %></div>
  <div class=​"price"​>​<​%= product.price %></div>
  </div>
 <​% end %>
 </div>

Executing this would print out each of the products in @products and assign each one a custom ID like product_23 (where the product’s ...

Get Pragmatic Guide to Sass 3 now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.