154 Haml [0.5d]

Haml is the template language we use instead of ERB in most projects. This lesson teaches you to read and write it.

Important

Work on this lesson in teacher mode.

Learning goals

• You can read a Haml template: tags, classes and ids, nesting by indentation, Ruby that renders (=) and Ruby that doesn't (-), and interpolation.
• You can write in Haml everything you have written in ERB so far, including layouts, partials, forms and blocks.
• You can choose between Haml's two attribute syntaxes: parentheses for static values, hashes when attributes are composed from variables.
• You know how Haml handles whitespace, and how to remove it around a tag when inline elements render with unwanted gaps.

Resources

Read what's new to you, skim what's familiar, skip what you already master. Stop when you can meet the learning goals.

Your agent can also generate an overview, a tutorial or an explanation for anything here, tailored to what you already know. Just ask.

• 📄 Haml reference Show archive.org snapshot — the one page you need; see attributes Show archive.org snapshot and whitespace removal
• 📄 Haml tutorial Show archive.org snapshot — ten minutes to the basics
• 🎮 html2haml Show archive.org snapshot — converts HTML or ERB to Haml; useful to check your own conversions, not to skip them

Exercises

Convert MovieDB from ERB to Haml:

• Add gem 'haml' to your MovieDB.
• Convert the first template by hand.
• Have your agent convert a second one, and review the result line by line — would you have written it that way? (This is your first taste of reviewing generated code; there will be much more of it later in the program.)
• Convert the rest yourself, and check every page still renders the same HTML.

Hint

The Haml-tutorial Show archive.org snapshot doesn't show how to execute ruby-code that isn't rendered to HTML. To do this start a line with a dash ('-') instead of the equals-sign ('=').