Bootstrap simplemente ha explotado en la comunidad de desarrollo web. Siempre habrá escépticos y enemigos, pero en general, el proyecto ha sido un éxito rotundo y puede verse constantemente en la parte superior de las listas de Forked y Watched en GitHub.
Como resultado de la fama de Bootstrap, la comunidad de desarrollo ha presentado una gran cantidad de excelentes recursos relacionados. Hoy hemos recopilado nuestros favoritos en una lista de todo lo que necesita para comenzar con Bootstrap. Desde tutoriales introductorios hasta kits de armado de alambres y generadores personalizados, aquí hay algo para cada amante de Bootstrap.
Iniciar bootstrap
Start Bootstrap es una plataforma todo en uno para todo tipo de temas, guías y plantillas HTML premium gratuitas y de diseño previo creadas con Bootstrap.
El sitio incluye plantillas predefinidas gratuitas para crear páginas de destino, sitios web de currículums personales, carteras y mucho más. También hay muchos diseños rápidos de plantillas de Bootstrap que puede descargar para comenzar rápidamente en sus proyectos de diseño web.
Además, Start Bootstrap tiene una enorme lista de recursos de Bootstrap que incluye enlaces a todo tipo de recursos relacionados con Bootstrap, como complementos, constructores visuales, integraciones de marcos, y más.
CodyHouse
CodyHouse es una biblioteca llena de componentes web gratuitos que incluyen complementos de HTML, CSS y JavaScript. La biblioteca incluye mega menús bellamente diseñados, plantillas de cartera, integraciones de pago, efectos de animación, plantillas de video y otros complementos.
Puede descargar estos complementos y plantillas para integrarlos fácilmente en sus propios diseños de sitio web de Bootstrap para integrar diversas funciones y características, sin cargo.
Bootsnipp
Esta es otra plataforma que ofrece una colección masiva de recursos y complementos HTML y CSS. La especialidad de Bootsnipp es que esta plataforma presenta fragmentos de código y complementos creados por otros desarrolladores y diseñadores web.
Bootsnipp incluye todos los tipos de fragmentos de código y plantillas para ayudar a que el proceso de desarrollo web sea mucho más fácil, incluidas las plantillas de formulario, los diseños de botones, las barras de progreso, las plantillas de galería y más.
Puede unirse a la plataforma como usuario registrado y crear su propia colección de recursos de Bootstrap también. Bootsnipp también incluye recursos para otros marcos HTML, como Foundation y Semantic UI.
Codrops
Codrops es un blog que comparte tutoriales y planos sobre cómo crear plantillas y elementos únicos con HTML y CSS. Lo mejor de este blog es que además de permitirle descargar las plantillas y complementos de forma gratuita, también describirá en detalle cómo se creó cada plantilla y cómo puede personalizarlas según sus preferencias.
Codrops incluye recursos, planos, plantillas y complementos que puede integrar con Bootstrap para crear secciones de portafolio, presentaciones de diapositivas, fondos de video, animaciones y mucho más.
Fragmentos
Shards es un moderno y minimalista kit de interfaz de usuario creado con Bootstrap 4 para diseñar sitios web asombrosos y móviles.
Al usar este kit de interfaz de usuario, no tendrá que escribir código para personalizar ninguno de los elementos de Bootstrap, como los botones y los menús. El kit de UI se encargará de todo eso por ti.
Reloj de arranque
Este sitio presenta una colección de temas personalizados para el marco de Bootstrap en varios esquemas de colores y diseños diferentes.
La lista incluye un tema temático de Bootstrap, un tema de diseño de material, tema de diseño plano, temas de color oscuro y más. Puede descargar y usar estos temas para personalizar la apariencia de sus diseños de Bootstrap sin tener que editar el código.
Fontello
Fontello es un ingenioso generador de fuentes de íconos que te permite explorar una colección masiva de íconos de varios paquetes de íconos de fuentes populares, que incluyen Font Awesome, Typicons, Brandico y más.
Las fuentes de iconos son ampliamente utilizadas en casi todos los diseños de sitios web en estos días. Puede usar la función de búsqueda en Fontello para encontrar rápidamente un paquete de fuentes con un ícono relacionado con su búsqueda, ajustar el tamaño del ícono y descargar la fuente del ícono para usar con sus diseños de Bootstrap.
Combustible UX
Fuel UX es utilizado principalmente por diseñadores web avanzados para sobrealimentar el marco de Bootstrap con mejoras de JavaScript más complicadas y ligeras. Mejora Bootstrap con una funcionalidad ampliada y te da más control sobre la personalización del marco. Fuel UX también forma parte de Salesforce Marketing Cloud.
Typehead.js
¿Desea agregar una impresionante función de autocompletar similar a Google en el cuadro de búsqueda de su sitio web? Luego, puede descargar esta biblioteca ligera de JavaScript e integrarla en su sitio web de Bootstrap para actualizar fácilmente su cuadro de búsqueda con frases de búsqueda con autocompletado, sugerencias automáticas y más.
Galería Blueimp
Blueimp es una colección de plantillas de galería sensibles y táctiles que puede usar en su sitio web para agregar galerías de imágenes y videos, así como también portafolios.
El complemento se realiza en base a la biblioteca Swipe JavaScript, que se considera el control deslizante táctil más preciso. Blueimp amplía la funcionalidad de Swipe al permitirle elegir entre tres modelos de galería diferentes, incluido el carrusel de imágenes, el carrusel de video y una galería de imágenes de lightbox.
Bootstrap Expo
Este es un sitio que presenta una colección de magníficos sitios web creados con Bootstrap. La colección está a cargo de Mark Otto, el fundador de Bootstrap y el director de diseño de Github. Es un gran lugar para encontrar inspiración para tu próximo proyecto y ver qué cosas increíbles puedes construir con Bootstrap.
StyleBootstrap
Esta herramienta le permite usar una interfaz simple para personalizar varios aspectos de Bootstrap. La diferencia aquí es que éste se enfoca principalmente en los aspectos visuales y de diseño. Puede ingresar y cambiar colores, fuentes, bordes y mucho más fácilmente.
La aplicación en sí también es más visual que el generador de Twitter y te permite ver cómo se verán tus estilos antes de presionar el botón de descarga.
Hermosos Botones para Bootstrap
Esta es una pequeña herramienta simple que solo hace una cosa: te ayuda a diseñar botones de excelente apariencia para usar con Twitter Bootstrap. Solo se compone de cuatro controles deslizantes y un cuadro para copiar el CSS resultante, ni menos, ni más. No revolucionará la forma en que usas Bootstrap, pero es divertido jugar con él.
WrapBootstrap
? WrapBootstrap es un mercado para temas y plantillas de Bootstrap premium. Impresione a sus clientes y visitantes utilizando una base única y sólida como una roca.
Piense en WrapBootstrap como ThemeForest para Bootstrap. Puedes comprar o vender temas de Bootstrap de estilo personalizado. Si crees que es tonto gastar dinero en un tema premium para un recurso gratuito como Bootstrap, solo echa un vistazo al éxito del mercado de temas de WordPress. De forma predeterminada, todos los sitios de Bootstrap comienzan a lucir igual y los temas bien diseñados pueden agregar variaciones agradables a la vez que le permiten conservar los grandes beneficios que ofrece Bootstrap.
Construido con Bootstrap
Construido con Bootstrap es un blog no oficial de Tumblr que muestra varios sitios web que, como su nombre indica obviamente, se han creado utilizando Bootstrap. Este es un recurso fantástico para los diseñadores que trabajan con Bootstrap, ya que le permite ver lo que los desarrolladores reales están haciendo con el marco, lo que lo inspirará a seguir avanzando.
Si crees que Bootstrap no es capaz de llevar a nada más que un diseño simple, esta galería probará que estás equivocado. Sitios como Provo Restaurant realmente me sorprendieron al no parecerme a un clon de las páginas de ejemplo de Bootstrap.
Biblioteca gratuita de widgets de Bootstrap de Twitter
Axure es una aplicación potente, de nivel profesional, que te permite construir wireframes complejos y maquetas interactivas. Con un costo de $ 589 por licencia, es una solución solo para los telegramadores serios.
Si desea trabajar con Twitter Bootstrap y Axure, asegúrese de descargar esta gran biblioteca de widgets gratuitos, que incluye representaciones personalizables perfectas de los elementos de Bootstrap que funcionan perfectamente en Axure.
Bootstrap PSD
Sé lo que muchos de ustedes están pensando, ¿Fuegos artificiales? Axure? OmniGraffle? ¡¿Dame un PSD ?! Bien, estás de suerte, porque Repix Design se ha tomado el tiempo de crear y distribuir una PSD detallada y personalizable que contiene todos los diversos componentes de Bootstrap.
Si te gusta hacer tu wireframing en Photoshop y eres un Bootstrapper, esta descarga gratuita no es fácil. Ve a agarrarlo ahora.
Fuente impresionante
Font Awesome es probablemente mi recurso favorito de Twitter Bootstrap. Básicamente es solo una fuente de icono, por lo que cualquiera puede usarla para cualquier proyecto. Sin embargo, fue diseñado específicamente para complementar la estética visual de Bootstrap.
Font Awesome es gratuito para uso comercial, compatible con el lector de pantalla y contiene 150 iconos (un número que sigue creciendo). Marca este porque te va a encantar.
Sass Twitter Bootstrap
Cuando los usuarios de Twitter crearon Bootstrap, decidieron mejorarlo aún más con LESS, un popular preprocesador de CSS que aporta la magia de las variables, los mixins y mucho más a CSS.
La cosa es que hay una gran división en la base de fans del preprocesador. Algunas personas aman MENOS porque es simple e increíblemente fácil de usar, pero muchos optan por la alternativa más poderosa: Sass. No podemos culpar a los desarrolladores de Twitter por tomar la ruta LESS, ¡pero los fanáticos de Sass también necesitan algo de amor! Afortunadamente, John W. Long ha transferido Bootstrap a Sass, por lo que ahora ambos lados del debate del preprocesador pueden al menos estar de acuerdo en una cosa: Bootstrap rock.
Los fanáticos de Stylus no tienen que lamentar el hecho de que a menudo no logran una mención, también hay un puerto Bootstrap Stylus.
Colorpicker y Datepicker para Bootstrap
Aquí hay un par de elementos adicionales que puede agregar a Bootstrap. Ambos son gratuitos, están bien documentados y encajan perfectamente con la estética de Bootstrap.
¿Cómo complementar Bootstrap?
Ahora que ha visto nuestra lista de increíbles recursos de Bootstrap, queremos saber de usted. Envíenos un tweet para decirnos qué recursos de terceros ha incorporado en ese proceso.
Oreja
Bootstrap es un conjunto de herramientas de código abierto para desarrollar con HTML, CSS y JS. ¡Nuestra serie presenta sugerencias e ideas para trabajar con Bootstrap, y colecciones inspiradoras de plantillas para comenzar rápidamente!