lundi 28 octobre 2013

ZenCoding : Accélérer votre développement

ZenCoding

Le Zen Coding (maintenant appelé Emmet) est un ensemble d'extensions pour les éditeurs de texte HTML qui permet d'accélérer la saisie de la syntaxe de programmation. Plusieurs outils supportent cette méthode d'entrée, tel que Visual Studio, Eclipse et Sublime text. C'est comme si "l'intelli-sence" avait eu une "date" avec les expressions régulières.

Par exemple, avec l'ajout du module "Web Essentials" dans Visual Studio, il est possible d'avoir un échantillon de texte simplement en tapant "Lorem" suivi de la touche de tabulation, suite à cette action trente mots apparaîtront pour remplir l'espace.

Par contre, si je désire un texte un peu plus court. Je peux taper "Lorem10", et dix mots s'afficheront. Avec une simple liste de commandes je peux générer des structures HTML et CSS très rapidement.


Par exemple, je peux créer un élément "div" avec comme titre "MLA3" et un identifiant "01"

Commande: div[Title="MLA3"][id="01"] + TAB

Résultat : <div title="MLA3" id="01"></div>

Avec une expression un peu plus complexe telle que :

ul>li*5>lorem3

J'obtiens un bloc complet d'une énumération en HTML.

<ul>
    <li>Lorem ipsum dolor.</li>
    <li>Sit amet, consectetur.</li>
    <li>Adipiscing elit fusce.</li>
    <li>Vel sapien elit.</li>
    <li>In malesuada semper.</li>
</ul>


N'est-ce pas "Wonderful"?  Il vaut la peine de maitriser cette syntaxe puisqu'elle est pratiquement identique d'un logiciel à l'autre, pour ceux qui la supportent. Elle nous fait sauver un temps précieux à écrire, mais aussi à chercher et corriger les erreurs de syntaxe HTML/CSS que nous aurions pu faire si nous l'avions tapé du <début> à la </fin>! De plus, vous aurez l'air d'un disciple de Bruce Lee, au sommet de son art!

En voici une dernière juste pour vous pratiquez!

Liens