-Haml Presentation

HamlSea-Anna Thompson

Full-Stack Rails Developer

Hi! I am Haml the hippo.

Overview> What is Haml

> Why Haml is used

> Examples of HTML vs. HAML code *scaffolded a table that takes in name and age

> Haml and javascript

> Errors

> Summary

What is Haml (HTML abstraction markup language)

Indented, very clean and easy to read Markup

> Takes HTML tags < > and replaces them with %

> Takes Class and ID and defines them as . and # inside documents

> Templating engine for Ruby on Rails

Haml loves to be clean and simple

Haml continued...> Haml uses indentation instead of end tags

> Replaces ERB files of HTML to embed ruby without all the markup

>Implements Rails templates with the .haml extension

> Focuses on cleanliness, readability, and production speed

Comparison HTML vs HAMLHTML

● <li> </li>

● <div class=“green_font”></div><div id=“notice”></div>

● .html.erb

● <% field %>

HAML

● %li

● .green_font#notice

● .html.haml

● = field

Why use Haml? There are so many Markup languages . . . > Code looks clean and easy to read

> Tags are prefixed with fewer characters

> Closing tags aren’t required

> Integrates Ruby code

yay!

Let see an exampleOf a FORM

_form.HTML.erbForm

> Has an error message

> Takes a name and age of hippo

> Embedded Ruby code <% %>

> Classes are defined within a div

and labeled with class =

> Creates a hippo on submit

Characters = 568

Let's see what It looks like in

HAML

_form.HTML.haml Form

> Same error message

> Still takes a name and age of hippo

> Embedded Ruby code With =

*Without <% %>

> Classes are defined with .

> Will create a Hippo

Characters = 377

Let’s see another example of a Table

in the view of index.html.erb

index.html.erbHippo Table

> Has name and age

> Embedded Ruby code <% %>

> Lots of closing tags </ >

> Characters = 577

same view, but in Haml . . .

index.HTML.haml Hippo Table

> Has a name and age

> Embedded Ruby code With =

*Without <% %>

> Major loss of closing tags

Characters = 408

HTML HAMLVS

But what about Javascript?

Javascript and Haml> You can pass ruby variables easily to javascript

> Can place javascript directly into a haml file if it is small and simple

Example of an alert with javascript in a haml file

Warning! Things do go wrong . . . > Haml will break if it is not properly indented or spaced correctly

> Nesting text can break easily.

Sometimes, Haml gets angry...

Summary> Programmers enjoy Haml because of how clean the code is

> There are no end tags required and les characters overall

> Cool markup to learn if you are using ruby on rails

> Errors in rails will tell you what’s exactly wrong so it is okay to try and learn

> Seen in a lot of current rails projects

> There is a lot more to learn . . .

Get to know HAML more . . . > Sitepoint

https://www.sitepoint.com/an-introduction-to-haml/

> Haml.com

http://haml.info/docs/yardoc/file.REFERENCE.html

> Github

https://github.com/indirect/haml-rails

> Online Converters

https://haml2erb.org/

http://htmltohaml.com

Thank you

Twitter @TheCoachFit

Github https://github.com/Seaanna

Linkedin www.linkedin.com/in/sea-anna

Email [email protected]

Website seaannathompson.com

Sea-Anna ThompsonFull-Stack Rails Developer