Haml anyone?

I announced to the social-media-verse earlier last week that I was starting as an engineer at General Assemb.ly! I’m really excited to be a part of their team and it looks like I’m going to be working on some really interesting projects and products in online education, among other things.

One of the first things I did this week was learn some haml. Haml is a markup language that allows someone to “cleanly and simply describe the html of any web document”. Basically haml is cool because it lets you do the same thing you’d do with html or html.erb files but with much less code.

For example, you don’t have to close tags! So instead of writing
<h1>This is great</h1> all you do instead is %h1 Amazing!!

I was really curious then as to how this affects being able to dictate classes and ids for the scss I’ve gotta put in. Well, reading through that was when I decided to write this post because it’s so clean and simple. You use the same symbols you would in the css doc but in the haml doc. For example, %div#awesome is equal to

<div id="’awesome’">
</div>
<code>. For classes, it’s similar to %div.more.amazing.stuff is like typing <code> </code></code>
<div amazing="" class="’more" stuff="">
</div>
.
The only annoying part (so far) is that you have to be careful about your spaces/spacing so it will error if you don't have the right number of spaces as you nest.

There’s lots more and the docs are surprisingly good so check out the resources here: http://haml.info/docs/yardoc/file.REFERENCE.html

And here: http://haml.info/