Al­te­r­na­ti­vas a Bootstrap: los mejores fra­me­wo­r­ks para frontend

Trabajar en el frontend de una web significa en­fre­n­tar­se a varios desafíos. El primero de ellos es conseguir la apa­rie­n­cia visual adecuada, sin perder la vista a la facilidad de uso. Debido a los di­fe­re­n­tes di­s­po­si­ti­vos y na­ve­ga­do­res con los que los usuarios acceden a los co­n­te­ni­dos web, es necesario que los elementos visuales y técnicos funcionen bien en la totalidad de las pla­ta­fo­r­mas se­le­c­cio­na­das. La ac­ce­si­bi­li­dad, así como un conjunto de buenas prácticas SEO, son tareas que no se pueden pasar por alto a la hora de programar apli­ca­cio­nes para los usuarios.

Aquellos pro­gra­ma­do­res que no quieren comenzar con el de­sa­rro­llo de una interfaz web desde cero suelen utilizar fra­me­wo­r­ks UI o entornos de trabajo de interfaz de usuario. Muchos suelen de­ca­n­tar­se por Bootstrap, una solución de­sa­rro­lla­da por Twitter cuyos co­m­po­ne­n­tes están op­ti­mi­za­dos para di­s­po­si­ti­vos móviles y para los pri­n­ci­pa­les na­ve­ga­do­res, y con la cual, además, es fácil realizar cualquier idea. Sin embargo, su amplia di­s­tri­bu­ción también se ha encargado de que exista una gran variedad de páginas web creadas con el código estándar de Bootstrap y que, por lo tanto, sean muy similares. Una pequeña crítica es también su co­m­ple­ji­dad, pues se basa en una gran cantidad de CSS y Ja­va­S­cri­pt y hace que el marcado de HTML sea mucho más exhau­s­ti­vo, lo que puede re­fle­jar­se, entre otras cosas, en los tiempos de carga de la web. Si bien es posible descargar el script y los archivos CSS reducidos, de tal forma que solo contengan los co­m­po­ne­n­tes Bootstrap ne­ce­sa­rios, será necesario ocuparse in­te­n­si­va­me­n­te de ello. Aquí, la intención que lleva a muchos a usar un framework, esto es, la si­m­pli­ci­dad y el ahorro de tiempo, se pierde un poco. Como co­n­se­cue­n­cia, a algunos de­sa­rro­lla­do­res no les parece que este framework UI sea siempre la mejor opción y se decantan, por lo tanto, por alguna de las al­te­r­na­ti­vas a Bootstrap, algo que, debido al gran abanico de po­si­bi­li­da­des, tampoco resulta una tarea fácil.

A co­n­ti­nua­ción, pre­se­n­ta­mos cinco entornos de trabajo frontend que pueden ser uti­li­za­dos como solución al­te­r­na­ti­va al framework de Twitter para crear una interfaz web completa y funcional. Además, exponemos sus ventajas y de­s­ve­n­ta­jas y sus di­fe­re­n­cias con Bootstrap, así como es­tu­dia­mos la amplitud de las co­le­c­cio­nes de código y para qué labor resultan más pe­r­ti­ne­n­tes. Por último, ana­li­za­mos cómo funciona el de­sa­rro­llo web con cada al­te­r­na­ti­va.

El framework modular Fou­n­da­tion nació como una guía de estilo producida por la agencia de diseño web ZURB para los proyectos de sus clientes. Po­s­te­rio­r­me­n­te, ZURB lanzó sus numerosos co­m­po­ne­n­tes HTML, CSS y Ja­va­S­cri­pt como framework de código abierto. Su núcleo, un Gri­d­La­yout de doce partes, facilita el diseño web re­s­po­n­si­vo, para que se adapte au­to­má­ti­ca­me­n­te a los tamaños de pantalla y las re­so­lu­cio­nes de los di­fe­re­n­tes di­s­po­si­ti­vos. Además de este sistema de cua­drí­cu­las, Fou­n­da­tion ofrece, entre otras, las si­guie­n­tes pla­n­ti­llas:  

• Sliders

• Botones

• Ti­po­gra­fía

• Media co­n­tai­ne­rs

• Listas y barras de menú

• Clases float y vi­si­bi­li­ty in­te­gra­das

De la misma forma que Bootstrap desde su cuarta versión, Fou­n­da­tion está basado en Sass, un lenguaje de estilo si­m­pli­fi­ca­do para crear y editar archivos CSS, pero no soporta Less (otro lenguaje de  hojas de estilo con el que Bootstrap sí es co­m­pa­ti­ble). Mientras que, a primera vista, las di­fe­re­n­cias en cuanto a los plugins Ja­va­S­cri­pt y a los fra­g­me­n­tos CSS no son evidentes, Fou­n­da­tion ofrece un número si­g­ni­fi­ca­ti­va­me­n­te menor de pla­n­ti­llas así como un soporte reducido de otras pla­ta­fo­r­mas. El framework de ZURB supera si­g­ni­fi­ca­ti­va­me­n­te a la solución de Twitter en lo que respecta a la in­di­vi­dua­li­dad del frontend de cada de­sa­rro­lla­dor, pues el código CSS su­b­ya­ce­n­te pro­po­r­cio­na acceso a un diseño compacto que se puede adaptar fá­ci­l­me­n­te a las ne­ce­si­da­des in­di­vi­dua­les. A di­fe­re­n­cia de Bootstrap, algunas clases son im­ple­me­n­ta­das di­re­c­ta­me­n­te, ahorrando así tiempo y esfuerzo a la hora de añadirlas. Otra ventaja: ZURB ofrece di­fe­re­n­tes cursos y apoyo personal para tu proyecto de frontend así como una versión especial del framework para diseñar ne­w­s­le­t­te­rs. Si deseas utilizar Fou­n­da­tion para el de­sa­rro­llo de una interfaz web, puedes utilizar el juego completo de elementos o de­ca­n­tar­te por un pack gratuito pe­r­so­na­li­za­do con los co­m­po­ne­n­tes ne­ce­sa­rios en su página web oficial.

A mediados de 2013, Yahoo lanza Pure.CSS, una es­tru­c­tu­ra básica para el de­sa­rro­llo de in­te­r­fa­ces web que es co­n­si­de­ra­da como una al­te­r­na­ti­va a Bootstrap de gran calidad, pero que también se puede utilizar en conjunto con este framework. Pure se basa en la ar­qui­te­c­tu­ra modular y escalable para CSS SMACSS (Scalable and Modular Ar­chi­te­c­tu­re for CSS), que se asegura de separar aquellos elementos re­pe­ti­ti­vos (tablas, botones o fo­r­mu­la­rios) del diseño básico (tipo de letra, diseño, etc.) y les permite tener co­n­ve­n­cio­nes propias. El framework de Yahoo asigna a cada módulo (in­de­pe­n­die­n­te­me­n­te de si se trata del diseño regular o de reglas es­pe­cí­fi­cas) un nombre de clase estándar con el prefijo “pure” y los in­te­r­pre­ta como su­b­mó­du­los. Así, por ejemplo, para insertar un fo­r­mu­la­rio en el que los elementos se en­cue­n­tran uno debajo del otro, se es­pe­ci­fi­ca­rá, por defecto, la clase “pure-form” y la clase “pure-form-stacked” para denotar a la subclase. Este framework para frontend, que puede de­s­ca­r­gar­se en una versión re­s­po­n­si­va y en una no re­s­po­n­si­va, contiene seis módulos que, en su forma co­m­pri­mi­da, tienen un tamaño de 4 GB (de­s­co­m­pri­mi­dos, de 16 KB):

• Base (base-min.css): base del framework, in­clu­ye­n­do su conjunto de normas

• Grids (grids-re­s­po­n­si­ve-min.css): sistema grid flexible y re­s­po­n­si­vo

• Forms (forms-min.css/forms-nr-min.css): fo­r­mu­la­rios

• Buttons (buttons-min.css): di­fe­re­n­tes botones

• Tables (tables-min.css): tablas

• Menus (menus-min.css/menus-nr-min.css): menús

Todos estos módulos se basan, de la misma forma que los co­m­po­ne­n­tes de Bootstrap y de otros fra­me­wo­r­ks CSS, en las hojas de estilo de código abierto Normalize.css, que reemplaza el estilo estándar de los elementos HTML con estilos op­ti­mi­za­dos para los di­fe­re­n­tes na­ve­ga­do­res. En co­m­pa­ra­ción con el framework de frontend de Twitter, la solución de Yahoo no contiene todas las apli­ca­cio­nes Ja­va­S­cri­pt, aunque, como sucede a menudo, se pueden im­ple­me­n­tar ma­nua­l­me­n­te en todo momento. Cabe resaltar que Pure.CSS no es tanto un frontend ya terminado que solo requiere ser ajustado a las ne­ce­si­da­des pe­r­so­na­les, sino, más bien, el punto de partida para un proyecto y, por lo tanto, asociado a un grado si­g­ni­fi­ca­ti­va­me­n­te mayor de libertad en lo que respecta al diseño. Yahoo aloja a Pure.CSS en su propia Content Delivery Network, (Yahoo CDN) de tal forma que, para integrar tu proyecto, solo necesitas hacer una simple re­fe­re­n­cia en el en­ca­be­za­do (<head>). Ló­gi­ca­me­n­te también es posible descargar Pure.CSS y alojarlo por tu cuenta. El enlace actual para la CDN y para la descarga de los archivos lo en­cue­n­tras en su web oficial purecss.io.

En 2013, el pro­gra­ma­dor Jack Lukic publica un framework como solución para el de­sa­rro­llo frontend bajo el nombre de Semantic UI. La gran ventaja de esta colección de código radica en la manera como busca si­m­pli­fi­car la escritura de código HTML a través de co­n­ve­n­cio­nes in­tui­ti­vas y fáciles de usar. Para este propósito, Semantic UI dispone de más de 3.000 clases CSS que tienen como finalidad optimizar el proceso de de­sa­rro­llo. Mientras que Bootstrap solo contiene un tema en el pack básico, Semantic UI cuenta, en su versión estándar, con más de 20 pla­n­ti­llas pre­di­se­ña­das. Sin embargo, el diseño con este framework puede resultar un poco más co­m­pli­ca­do que con Bootstrap: además de los archivos CSS y Ja­va­S­cri­pt básicos, el pack estándar contiene fuentes, el gestor de paquetes PHP Composer, el ad­mi­ni­s­tra­dor de archivos web Bower y el au­to­ma­ti­za­dor de tareas Gulp. Los co­m­po­ne­n­tes in­di­vi­dua­les están di­s­tri­bui­dos en las si­guie­n­tes seis áreas:

• Globals: de­fi­ni­cio­nes de estilo sobre la base de Normalize.css; ti­po­gra­fía y diseño básico

• Elements: co­m­po­ne­n­tes frontend como botones, iconos, co­n­te­ne­do­res y muchos más

• Co­lle­c­tio­ns: co­n­te­ni­dos es­tru­c­tu­ra­dos como la rejilla, los menús, las tablas o los fo­r­mu­la­rios

• Views: elementos in­ter­ac­ti­vos como campos para co­me­n­ta­rios, feeds de noticias o banners pu­bli­cia­rios

• Modules: widgets tales como menús de­s­ple­ga­bles, ventajas eme­r­ge­n­tes o casillas de ve­ri­fi­ca­ción

• Behaviors: in­te­r­fa­ces de pro­gra­ma­ción para Ja­va­S­cri­pt

Para pri­n­ci­pia­n­tes y usuarios con co­no­ci­mie­n­tos básicos, el sistema de nombres de Semantic UI puede ser ini­cia­l­me­n­te de­s­co­n­ce­r­ta­n­te y, en cada caso, estar ligado a una cierta práctica. Al final, no obstante, este esfuerzo vale la pena, debido a que leer el código HTML de su interfaz es mucho más intuitivo que en otros fra­me­wo­r­ks como Twitter Bootstrap, algo que resulta muy útil es­pe­cia­l­me­n­te durante las re­vi­sio­nes po­s­te­rio­res. Semantic UI está di­s­po­ni­ble en CSS y Less; además, ahora también existe una variante Sass, un punto que este framework semántico comparte con Bootstrap. Una gran de­s­ve­n­ta­ja de esta al­te­r­na­ti­va a Bootstrap es el hecho de que muchos de sus co­m­po­ne­n­tes Ja­va­S­cri­pt son de­pe­n­die­n­tes y no funcionan sin el lenguaje de script. Puedes descargar Semantic UI desde su página oficial, enlazar los archivos en la red de entrega de co­n­te­ni­dos JSDELIVR o utilizar los fra­g­me­n­tos de código di­s­po­ni­bles en el re­po­si­to­rio del framework en GitHub.

UIkit es la solución de código abierto para pro­gra­ma­ción frontend de­sa­rro­lla­da por la empresa de Hamburgo YOOtheme, con una gran ex­pe­rie­n­cia en el de­sa­rro­llo de apli­ca­cio­nes web, así como de temas para WordPress, Joomla y su propio website builder YOOtheme Pro. La extensa colección de co­m­po­ne­n­tes HTML, CSS y Ja­va­S­cri­pt se encuentra di­s­po­ni­ble bajo la licencia libre MIT y, por lo tanto, se puede utilizar y modificar sin ningún problema. Todos los fra­g­me­n­tos CSS están di­s­po­ni­bles en una variante Less y en una Sass. Los más de 30 módulos de esta al­te­r­na­ti­va a Bootstrap, como en el caso de sus pri­n­ci­pa­les co­m­pe­ti­do­res, están basados en Normalize.css, por lo que casi ningún navegador web tiene problemas para vi­sua­li­zar proyectos creados con UIkit.

Los co­m­po­ne­n­tes pri­n­ci­pa­les se dividen en las si­guie­n­tes seis ca­te­go­rías:

• Defaults: base para la no­r­ma­li­za­ción de los elementos HTML, gracias a la cual se logra la capacidad mu­l­ti­na­ve­ga­dor y las máximas de estilo básico

• Layout: he­rra­mie­n­tas para el diseño del frontend, por ejemplo, el sistema de cua­drí­cu­la, las cajas de contenido o clases CSS útiles para co­n­te­ni­dos que se repiten

• Na­vi­ga­tio­ns: todos los elementos que facilitan que el usuario explore la página web, in­clu­ye­n­do, entre otras cosas, módulos para la pa­gi­na­ción (nu­me­ra­ción de páginas) o las clásicas barras de na­ve­ga­ción

• Elements: estilos para bloques de contenido autónomos como tablas, listas y fo­r­mu­la­rios

• Common: co­m­po­ne­n­tes que se utilizan no­r­ma­l­me­n­te dentro del contenido, por ejemplo, botones, iconos, insignias o ani­ma­cio­nes

• Ja­va­S­cri­pt: módulos co­m­pue­s­tos pri­n­ci­pa­l­me­n­te por Ja­va­S­cri­pt para im­ple­me­n­tar elementos in­ter­ac­ti­vos

Para preparar co­n­te­ni­dos para los di­fe­re­n­tes tamaños de pantalla, UIkit dispone de varias clases re­s­po­n­si­vas. Con la ayuda de la he­rra­mie­n­ta online Cu­s­to­mi­zer puedes ajustar elementos pre­de­fi­ni­dos de gran im­po­r­ta­n­cia tales como, por ejemplo, 1.200 píxeles para pantallas de gran tamaño o 479 píxeles para sma­r­t­pho­nes con pantallas pequeñas. Para evitar co­m­pli­ca­cio­nes con otros snippets del framework o de CSS, todas sus clases se definen con el prefijo “uk”. Aquellos elementos Ja­va­S­cri­pt y CSS ne­ce­sa­rios para la creación de in­te­r­fa­ces web más complejas que no estén in­te­gra­dos en el núcleo del framework pueden serlo en cualquier momento, por ejemplo, cuando una web requiere un área de ad­mi­ni­s­tra­ción que incluye funciones de inicio de sesión, editor HTML y de carga de archivos.

A pesar de su im­pre­sio­na­n­te fu­n­cio­na­li­dad, el tamaño de archivo de los co­m­po­ne­n­tes in­di­vi­dua­les, así como del framework completo, es so­r­pre­n­de­n­te­me­n­te bajo. Esto se co­m­ple­me­n­ta con una extensa do­cu­me­n­ta­ción que si­m­pli­fi­ca en gran medida el trabajo inicial con UIkit, ca­ra­c­te­rí­s­ti­ca por la que también sobresale Bootstrap, así como por la gran selección de temas y oferta de tu­to­ria­les. Adi­cio­na­l­me­n­te, existen alrededor de 1.500 bi­fu­r­ca­cio­nes (forks) en GitHub, donde es posible encontrar y descargar todos los módulos de este framework de frontend. Aunque el pack completo también está di­s­po­ni­ble en su página principal, este entorno de trabajo no permite la in­s­ta­la­ción de módulos de forma in­di­vi­dual, con lo que aquellos que no se necesiten, tendrán que ser eli­mi­na­dos po­s­te­rio­r­me­n­te.

Ma­te­ria­li­ze es un framework CSS que se basa en los pri­n­ci­pios básicos del material design, un estilo de diseño im­ple­me­n­ta­do por Google en 2015 y que ahora es utilizado en la mayoría de sus apli­ca­cio­nes. Este concepto de diseño se basa en su­pe­r­fi­cies grá­fi­ca­me­n­te similares a tarjetas en un estilo mi­ni­ma­li­s­ta (flat design), pero que a la vez im­ple­me­n­tan muchas ani­ma­cio­nes y sombras. Los efectos de pro­fu­n­di­dad pro­du­ci­dos con esta técnica permiten que los usuarios capturen elementos de in­fo­r­ma­ción e in­ter­ac­ción con más facilidad. El de­sa­rro­llo de este entorno de trabajo con licencia MIT estuvo en manos de cuatro es­tu­dia­n­tes de la uni­ve­r­si­dad Carnegie Mellon en Pe­n­si­l­va­nia (Alvin Wang, Alan Chang, Alex Mark y Kevin Louie). Esta al­te­r­na­ti­va a Bootstrap, que, como el framework de Twitter, tiene un sistema de rejilla de 12 columnas, contiene co­m­po­ne­n­tes CSS y Ja­va­S­cri­pt con más de 700 símbolos de material design en una Iconfont y en Roboto, la fuente pre­de­te­r­mi­na­da del concepto de diseño propio de Google. Además de los archivos CSS ha­bi­tua­les en versión normal y reducida, también se puede, como con Bootstrap, apro­ve­char los archivos de origen SCSS escritos en Sass para facilitar el proceso de pe­r­so­na­li­za­ción de tu interfaz web. In­de­pe­n­die­n­te­me­n­te de tu elección, tendrás a tu di­s­po­si­ción 30 elementos di­fe­re­n­tes:

• CSS: la función primaria de CSS es, como en Bootstrap y otros fra­me­wo­r­ks UI, una rejilla re­s­po­n­si­va, que pro­po­r­cio­na las bases para que una interfaz web funcione en todos los di­s­po­si­ti­vos. El grid de Ma­te­ria­li­zed contiene tres tamaños pre­de­fi­ni­dos de vi­sua­li­za­ción: menos de 600 píxeles para di­s­po­si­ti­vos móviles, hasta 992 píxeles para tabletas y alrededor de 992 píxeles para los or­de­na­do­res de es­cri­to­rio. Otros snippets de CSS incluyen una paleta de colores basada en los colores primarios del material design, la ya me­n­cio­na­da fuente Roboto, así como di­fe­re­n­tes clases que se denominan “helpers” y son un apoyo a la hora de alinear el contenido.

• Co­m­po­ne­nts: los co­m­po­ne­n­tes son las partes ese­n­cia­les del framework de frontend ne­ce­sa­rios para la rea­li­za­ción de elementos de na­ve­ga­ción y de áreas in­ter­ac­ti­vas. Además de los co­m­po­ne­n­tes tra­di­cio­na­les como códigos para insertar pa­gi­na­ción, fo­r­mu­la­rios, barras de na­ve­ga­ción o iconos, también en­co­n­tra­rás módulos de im­po­r­ta­n­cia fu­n­da­me­n­tal para la apli­ca­ción del concepto del material design. Estos incluyen, por ejemplo, las “Cards” (las típicas co­le­c­cio­nes de objetos de Google para la pre­se­n­ta­ción de co­n­te­ni­dos) o los “Chips” si­m­bó­li­cos que permiten re­pre­se­n­tar etiquetas o contactos.

• Ja­va­S­cri­pt: en lo que respecta a las apli­ca­cio­nes Ja­va­S­cri­pt, Ma­te­ria­li­ze es, sin duda, una de las mejores al­te­r­na­ti­vas a Bootstrap. In­de­pe­n­die­n­te­me­n­te de si deseas mostrar tus imágenes en vista carrusel, añadir cuadros de diálogo in­ter­ac­ti­vos o darle vida a la interfaz con el efecto parallax, siempre tendrás a tu di­s­po­si­ción elementos Ja­va­S­cri­pt para lograr dicho fin. De esta forma, los usuarios del framework estarán equipados de la mejor manera para diseñar una interfaz web que, además, ofrece una gran usa­bi­li­dad tanto en di­s­po­si­ti­vos móviles como en or­de­na­do­res de es­cri­to­rio.

Para descargar los archivos del proyecto puedes visitar GitHub o su página web oficial ma­te­ria­li­ze­c­ss.com. Allí también en­co­n­tra­rás las dos pla­n­ti­llas di­s­po­ni­bles: “starter” y “parallax”, así como el código de marcado para acceder a los archivos del proyecto a través de la red de di­s­tri­bu­ción de co­n­te­ni­dos cdnjs.

En general, las al­te­r­na­ti­vas a Bootstrap pre­se­n­ta­das an­te­rio­r­me­n­te tienen mucho en común con el framework de Twitter. En todos los casos, el co­m­po­ne­n­te central es una rejilla de gran fle­xi­bi­li­dad que co­n­tri­bu­ye a la im­ple­me­n­ta­ción efectiva de la interfaz web en la mayoría de di­s­po­si­ti­vos. Las di­me­n­sio­nes máximas y mínimas de los di­fe­re­n­tes tamaños de pantalla se di­fe­re­n­cian de framework a framework y por lo general, como de­sa­rro­lla­dor, tienes una gran libertad en la ada­p­ta­ción. Esto no solo es válido para las redes, sino también para los demás elementos CSS que también, en algunos casos, pueden ser im­ple­me­n­ta­dos muy fá­ci­l­me­n­te, lo que no siempre es el caso de Bootstrap. También existen di­fe­re­n­cias en el sistema de clases de las al­te­r­na­ti­vas a Bootstrap, donde Semantic UI se destaca pa­r­ti­cu­la­r­me­n­te. En lugar de las clases CSS típicas, el framework UI, haciendo honor a su nombre, ha integrado más de 3.000 clases se­má­n­ti­cas, que tienen como principal finalidad hacer que la pro­gra­ma­ción del código sea aún más intuitiva. La si­m­pli­fi­ca­ción de la co­di­fi­ca­ción se lleva a cabo, en la mayoría de co­le­c­cio­nes, a través de los lenguajes Less y Sass, quienes permiten pe­r­so­na­li­zar fá­ci­l­me­n­te tu interfaz con hojas de estilo, antes de que estas se co­n­vie­r­tan en el tra­di­cio­nal formato CSS para que puedan ser in­te­r­pre­ta­das co­rre­c­ta­me­n­te por el navegador web. Pure.CSS es la única solución que evita el uso de ambos pre­pro­ce­sa­do­res CSS, aunque, con SMACSS, la ar­qui­te­c­tu­ra modular y escalable para CSS, ofrece un buen punto de partida para el uso de CSS. Las di­fe­re­n­tes al­te­r­na­ti­vas a Bootstrap convencen a niveles distintos, por lo que no es posible declarar una única solución como la más adecuada para la pro­gra­ma­ción de apli­ca­cio­nes. Es por esto que es re­co­me­n­da­ble que tomes tu decisión siempre en función de las ne­ce­si­da­des de tu proyecto web y que te hagas las si­guie­n­tes preguntas:

• ¿Los co­m­po­ne­n­tes están es­tru­c­tu­ra­dos de forma atractiva?

• ¿Ofrece el sistema de rejilla las opciones deseadas?

• ¿Cómo de im­po­r­ta­n­te es la co­m­pa­ti­bi­li­dad con versiones an­te­rio­res de los na­ve­ga­do­res?

• ¿Cumplen los módulos CSS y Ja­va­S­cri­pt con las ne­ce­si­da­des de tu proyecto? 

• ¿Es pro­po­r­cio­nal el tamaño del código (co­m­pri­mi­do y no co­m­pri­mi­do)?

• ¿Tu proyecto demanda fle­xi­bi­li­dad para adaptar los códigos ne­ce­sa­rios? Y, si es así, ¿qué opciones ofrece este framework UI?

• ¿Inviertes trabajo en una gran comunidad (de­sa­rro­llo, ex­te­n­sio­nes, pla­n­ti­llas, foros, tu­to­ria­les, etc.)?

Si estás de­ba­tié­n­do­te entre di­fe­re­n­tes al­te­r­na­ti­vas a Bootstrap, te re­co­me­n­da­mos echar un vistazo a su manual online. A menudo, estos explican de­ta­lla­da­me­n­te los módulos e incluyen ejemplos de código ilu­s­tra­ti­vos. Más es­pe­cí­fi­ca­me­n­te, puede que las po­si­bi­li­da­des de cada uno de estos entornos te convenzan por sí mismos pro­bá­n­do­los. Aquí, la he­rra­mie­n­ta Codeply resulta de gran ayuda, pe­r­mi­tié­n­do­te probar los co­m­po­ne­n­tes de los di­fe­re­n­tes fra­me­wo­r­ks UI di­re­c­ta­me­n­te en el navegador y sin tener que descargar ningún archivo.