Emmet es un plugin para muchos de los más populares editores de texto que todo desarrollador web debe tener instalado sí o sí. Hace unos años era conocido como Zen Coding.
Fijaos en la imagen de arriba y apreciaréis como el código
ul#nav>li.item$*4>a{Item $}
se convierte automáticamente en
<ul id="nav"> <li class="item1"><a href="">Item 1</a></li> <li class="item2"><a href="">Item 2</a></li> <li class="item3"><a href="">Item 3</a></li> <li class="item4"><a href="">Item 4</a></li> </ul>
Se trata de acostumbrarse y conocer su sintaxis. Luego, una vez escrita la expresión, se pulsa la tecla ‘Tab ↹’, la cual expande el código.
Tenéis gran cantidad de documentación en su web oficial. Merece la pena dedicarle algo de tiempo a aprender a usarlo, una vez te acostumbras, no puedes prescindir de él.
Por otra parte, pongo los enlaces para instalarlo en dos editores de los que he hablado: Brackets y Sublime Text:
Curiosidad Fijaos si es un plugin popular, que incluso Codepen también lo lleva incluido.
Emmet, plugin esencial para desarrolladores