HAML. Prolongez la vie de votre clavier

Klimt, Salomé Je suis encore au stade de test avec HAML. Il faut un délais d'apprentissage pour penser et éditer dans l'esprit de Haml. Mais vous allez vous rendre compte suite aux exemples ci-dessous du pragmatisme poussé de ce moteur de template. Il est déja à sa version "HAML 2.0". Il existe aussi des versions pour PHP et ASP (sans commentaire) <h3>- Installation (RoR)</h3> <div class="CodeRay"> <div class="code"><pre>gem install haml</pre></div> </div> pour ajouter HAML comme plugin à votre application: <div class="CodeRay"> <div class="code"><pre>haml --rails /chemin/de/votre/application</pre></div> </div> J'ai oublié de vous dire qu'avec HAML vous venez aussi d'installer son compagnon SASS détaillé dans <a href="http://maxula.net/posts/sass" alt="sass css">cet article</a>.<p>Une fois le plugin installé, vous pouvez utiliser directement un template en Haml en changeant l'extension de la vue:<br/></p>/app/view/exemple/vue.html.erb -> /app/view/exemple/vue.html.haml<br/><h3>- Utilisation</h3> <p>Je mettrais des exemples qui sont plus parlant qu'une description technique</p> <strong>avant :</strong> <div class="CodeRay"> <div class="code"><pre> <span class="ta"><strong></span><span class="c"><%= item.title %></span><span class="ta"></strong></span></pre></div> </div> <strong>après :</strong> <div class="CodeRay"> <div class="code"><pre>%strong= item.title</pre></div> </div> <p>Comme vous voyez le principe est simple, mais peut être pas encore convainquant, le suivant !!! ...</p> <strong>avant :</strong> <div class="CodeRay"> <div class="code"><pre> <span class="ta"><div</span> <span class="an">id</span>=<span class="s"><span class="dl">'</span><span class="k">content</span><span class="dl">'</span></span><span class="ta">></span> <span class="ta"><div</span> <span class="an">class</span>=<span class="s"><span class="dl">'</span><span class="k">title</span><span class="dl">'</span></span><span class="ta">></span> <span class="ta"><h1></span><span class="il"><span class="idl"><%=</span> <span class="iv">@table</span>.titre <span class="idl">%></span></span><span class="ta"></h1></span> <span class="il"><span class="idl"><%=</span> link_to <span class="s"><span class="dl">'</span><span class="k">Home</span><span class="dl">'</span></span>, home_url <span class="idl">%></span></span> <span class="ta"><p</span> <span class="an">class</span>=<span class="s"><span class="dl">"</span><span class="k">paraf</span><span class="dl">"</span></span><span class="ta">></span><span class="il"><span class="idl"><%=</span> <span class="iv">@table</span>.contenu <span class="idl">%></span></span><span class="ta"></p></span> <span class="ta"></div></span><span class="ta"></div></span></pre></div> </div> <strong>après :</strong> <div class="CodeRay"> <div class="code"><pre>#content .title %h1= @table.title = link_to 'Home', home_url %p.paraf= @table.contenu</pre></div> </div> <p>Pause!..., bon, rien que là, je pense que vous êtes entrain de penser aux kilomètres de balises html que vous avez tapez durant toute votre vie de développement web, au temps passé à chercher la balise de fermeture perdue dans le fleuve de codes.</p> <p>Continuons...</p> <strong>avant:</strong> <div class="CodeRay"> <div class="code"><pre> <span class="ta"><ul</span> <span class="an">id</span>=<span class="s"><span class="dl">"</span><span class="k">menu</span><span class="dl">"</span></span> <span class="an">class</span>=<span class="s"><span class="dl">"</span><span class="k">decomenu</span><span class="dl">"</span></span><span class="ta">></span> <span class="il"><span class="idl"><%-</span> <span class="iv">@tirets</span>.each <span class="r">do</span> |i| <span class="idl">%></span></span> <span class="ta"><li></span><span class="il"><span class="idl"><%=</span> i.nom <span class="idl">%></span></span><span class="ta"></li></span> <span class="il"><span class="idl"><%-</span> <span class="r">end</span> <span class="idl">%></span></span> </pre></div> </div> <strong>après</strong> <div class="CodeRay"> <div class="code"><pre>%ul#menu.decomenu - @tirets.each do |i| %li= i.nom </pre></div> </div> <p>Comme vous voyez, pas besoin du "end" de la boucle, il est bien clair avec le décalage vers la droite (deux caractéres espace) qui indique la structure de l'arborescence.</p> <p>Ainsi, pour commenter et décommenter du code, ça devient plus simple et plus rapide</p> <strong>avant :</strong> <div class="CodeRay"> <div class="code"><pre> <span class="ta"><h2></span>sous-titre<span class="ta"></h2></span> <span class="ta"><div></span> <span class="c"></span> le reste du texte non-commenté<span class="ta"></div></span> <span class="c"></span> </pre></div> </div> <strong>après :</strong> <div class="CodeRay"> <div class="code"><pre> %h2 sous-titre %div / Une ligne à commenter le reste du texte non-commenté / %p plus qu'une ligne à commenter %div %h1 il n'est pas à sa place </pre></div> </div> Voyant des petits clins-d'oeil pour raccourcir les entêtes des templates <div class="CodeRay"> <div class="code"><pre> !!! 1.1</pre></div> </div> ca donne !! <div class="CodeRay"> <div class="code"><pre> <span class="dt"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"></span></pre></div> </div> encore un autre <div class="CodeRay"> <div class="code"><pre> /[if IE] %a{ :href =<span class="er">></span> 'http://www.mozilla.com/en-US/firefox/' } %h1 Get Firefox </pre></div> </div> ça génére <div class="CodeRay"> <div class="code"><pre> <span class="c"></span> </pre></div> </div> <p>Il me faut peut-être encore 2 ans de pratique autour de Haml pour ne plus me rendre compte de la quantité de code économisée, en même temps haml nous oblige à générer du code html bien structuré à la sortie 1

2009-05-27T13:13:10Z

1 HAML, moteur de template Ruby on Rails

image/png

klimt-salome.png

21536

HAML est un moteur de template sous Rails assez particulier, on arrive à écrire moins de code dans la vue pour le même résultat, avec une clareté de structure évidente. HAML. Prolongez la vie de votre clavier

2009-09-29T19:31:08Z

haml