Imagen ilustrativa para la entrada '¿Qué es Tailwind CSS y por qué es tan popular?'Imagen ilustrativa para la entrada '¿Qué es Tailwind CSS y por qué es tan popular?'

¿Qué es Tailwind CSS y por qué es tan popular?

Imagina estar construyendo algo y no preocuparte por el diseño de dicha construcción, pues ya tienes una gran variedad de componentes con unos estilos preestablecidos. Suena genial, ¿verdad?, pues algo así es de lo que voy a hablarte hoy.

Por todos ya es sumamente conocido Bootstrap y de hecho quizá hayas pensado en esta otra herramienta al leer lo que te he escrito en el párrafo anterior. Si es así no vas mal encaminado. 😉

CONTENIDO

¿Qué es Tailwind CSS?

La descripción formal dice que es un framework de CSS que permite que desarrolles un sitio de forma rápida y ágil mediante la asignación de clases. Tal cual, eso es lo que es.

Pero no solo ofrece diseño para componentes, sino que también puedes encontrar plantillas completas. Sí, como lo lees, directo y al grano.

Aunque también es cierto que esto no es lo más habitual, pero está ahí. El uso más habitual para este framework es el de ir construyendo tú mismo el sitio web mediante los componentes que te ofrece.

Como implementarlo en mi proyecto

Para poder comenzar a usarlo en tu proyecto contamos con varias opciones:

  • Vía NPM: Si ya tienes instalado en tu equipo NodeJS y cuentas con su gestor de paquetes NPM el procedimiento será tan sencillo como ejecutar la instrucción npm install -D tailwindcss
  • CDN: También puedes optar para conectar tu documento HTML con el CDN de Tailwind. Esta opción solo es recomendable quizá en fases de desarrollo, lo mejor para un proyecto en producción es alojar tú mismo el código para evitar posibles errores que pudiesen pasar en el servidor en el que está alojado el CDN y pueda afectar a nuestra web/proyecto.

Además cuenta con una integración fantástica como bibliotecas/frameworks sumamente populares como React o VueJS, de hecho muchos de los desarrollos con estas herramientas se hacen teniendo Tailwind en el CSS.

Te comparto un poco más de información al respecto en su documentación oficial.

¿Por qué debería usarlo?

Es probable que después de conocer un poco de información te estés haciendo esta pregunta. Voy a intentar comentarte algunos puntos por los que yo considero que es una opción a tener en cuenta:

Construir mucho en poco tiempo

Tu principal preocupación a la hora de construir es el contenido, pues el diseño gracias a su gran variedad de componentes ya lo tienes. Al ahorrarte prácticamente lo segundo consigues quitarte lo más pesado de la maquetación.

Es personalizable

Quizá cuando has leído que ya tiene bloques o estructuras predefinidas te has pensado que ese es el patrón a seguir y de lo que te ofrece no puedes salirte. Pues no, no es así. De hecho el propio framework en su configuración te ofrece opciones para hacerte la personalización más sencilla.

Tiene una comunidad enorme

Parece algo típico, pero en este caso es así. Es una herramienta que ha cogido mucha popularidad en los últimos años y esta no deja de crecer. Es por ello que ha conseguido cosechar un gran público que está dispuesto a ayudar y compartir recursos de forma constante y desinteresada.

Y este es un poco el resumen de esta herramienta. Imagino que te has quedado con ganas de conocer un poco más sobre ella, la solución a esa curiosidad es que te animes a probarla por ti mismo. 😄

ITCSS: Estructura tu código CSS como un profesional CodeLink: Comparte snippets de tu código