Las ventajas de usar Emmet son inmensas; entre muchas otras, agiliza tu proceso de escritura de código y destaca en el desarrollo web. ¿Te has fijado alguna vez en que al escribir código, especialmente HTML y CSS, a veces parece que estás haciendo un trabajo de copia y pega infinito?
Es más, puede que hayas pensado que debe haber una forma más rápida de hacerlo. La buena noticia es que sí la hay y se llama Emmet. Si eres un amante de Visual Studio, este artículo te interesa.
Ventajas de usar Emmet
Emmet es un plugin increíblemente útil que te permite escribir HTML y CSS de manera más eficiente. Pero ¿cómo?
Agiliza tu escritura de código
Una de las grandes ventajas de usar Emmet es que te permite escribir un mínimo de código y obtener un máximo de resultado. Significa que ya no tienes que teclear cada etiqueta individualmente, sino que Emmet lo hace por ti. Es algo así como tu asistente personal de desarrollo web.
nav>ul>li
Esto es Emmet. Escribe esa línea, presiona TAB
y ya ienes un nav con una lista dentro.
<nav> <ul> <li></li> </ul> </nav>
Autocompletado
Al igual que sucede con la mayoría de editores de texto, Emmet te proporciona autocompletado. Pero no estamos hablando de un autocompletado cualquiera, sino de uno muy mejorado.
h1{Hola mundo}
Esto se convierte en:
<h1>Hola mundo</h1>
Relleno automático
¿Sabías que Emmet te permite generar texto lorem de manera automática? Solo tienes que escribir lorem, pulsar TAB
y listo, un texto de prueba para que maquetes a gusto.
p>lorem
Así obtienes:
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit...</p>
Soporte para CSS
Emmet también funciona para CSS. Imagina poder escribir tus selectores de CSS de una manera mucho más rápida. Emmet lo hace posible.
Multiplicación y agrupación
Quizás te estés preguntando qué sucede si necesitas múltiples elementos al mismo nivel. Pues Emmet también tiene la solución. Con el operador *
puedes multiplicar elementos y con el operador ()
puedes agruparlos.
ul>li*5
Con eso, obtendrás cinco elementos li
dentro de un ul
.
Personalizable
Lo mejor de todo es que Emmet se puede personalizar según tus necesidades. En la documentación de Emmet, encontrarás toda la información.
Emmet es una herramienta imprescindible en tu kit de desarrollo web. ¿Y dónde puedes aprender más sobre Emmet y otras herramientas esenciales? Pues en el Desarrollo Web Full Stack Bootcamp de KeepCoding. Te enseñaremos las habilidades más demandadas del sector IT de la manera más eficiente posible. ¡Entra y descubre cómo especializarte en pocos meses!