Bootstrap (anteriormente Twitter Bootstrap ) es un marco CSS gratuito y de código abierto orientado al desarrollo de sitios web front-end responsivos y con prioridad para dispositivos móviles . Contiene plantillas de diseño basadas en HTML , CSS y (opcionalmente) JavaScript para tipografía , formularios , botones , navegación y otros componentes de interfaz.
A partir de mayo de 2023 [actualizar], Bootstrap es el 17.º proyecto con más estrellas (la 4.ª biblioteca con más estrellas) en GitHub , con más de 164 000 estrellas. [4] Según W3Techs, el 19,2 % de todos los sitios web utilizan Bootstrap. [5]
Bootstrap es una biblioteca HTML, CSS y JS que se centra en simplificar el desarrollo de páginas web informativas (a diferencia de las aplicaciones web ). El objetivo principal de agregarlo a un proyecto web es aplicar las opciones de color, tamaño, fuente y diseño de Bootstrap a ese proyecto. Como tal, el factor principal es si los desarrolladores a cargo encuentran esas opciones de su agrado. Una vez agregado a un proyecto, Bootstrap proporciona definiciones de estilo básicas para todos los elementos HTML . El resultado es una apariencia uniforme para prosa, tablas y elementos de formulario en todos los navegadores web . Además, los desarrolladores pueden aprovechar las clases CSS definidas en Bootstrap para personalizar aún más la apariencia de sus contenidos. Por ejemplo, Bootstrap ha previsto tablas de colores claros y oscuros, encabezados de página, citas destacadas más prominentes y texto con un resaltado.
Bootstrap también viene con varios componentes JavaScript que no requieren otras bibliotecas como jQuery . Proporcionan elementos de interfaz de usuario adicionales, como cuadros de diálogo , información sobre herramientas , barras de progreso, menús desplegables de navegación y carruseles. Cada componente Bootstrap consta de una estructura HTML, declaraciones CSS y, en algunos casos, código JavaScript adjunto. También amplían la funcionalidad de algunos elementos de interfaz existentes, incluida, por ejemplo, una función de autocompletar para campos de entrada.
Los componentes más destacados de Bootstrap son los de diseño, ya que afectan a toda la página web. El componente de diseño básico se llama "Contenedor", ya que todos los demás elementos de la página se colocan en él. Los desarrolladores pueden elegir entre un contenedor de ancho fijo y un contenedor de ancho fluido. Mientras que el último siempre llena el ancho con la página web, el primero utiliza uno de los cinco anchos fijos predefinidos, dependiendo del tamaño de la pantalla que muestra la página: [6]
Una vez que un contenedor está en su lugar, otros componentes de diseño de Bootstrap implementan un diseño CSS Flexbox mediante la definición de filas y columnas.
Hay disponible una versión precompilada de Bootstrap en forma de un archivo CSS y tres archivos JavaScript que se pueden agregar fácilmente a cualquier proyecto. Sin embargo, la versión básica de Bootstrap permite a los desarrolladores implementar más personalizaciones y optimizaciones de tamaño. Esta versión básica es modular, lo que significa que el desarrollador puede eliminar componentes innecesarios, aplicar un tema y modificar los archivos Sass no compilados .
Bootstrap, originalmente llamado Twitter Blueprint, fue desarrollado por Mark Otto y Jacob Thornton en Twitter como un marco para fomentar la coherencia entre las herramientas internas. Antes de Bootstrap, se utilizaban varias bibliotecas para el desarrollo de interfaces, lo que generaba incoherencias y una gran carga de mantenimiento. Según Otto:
Un grupo muy pequeño de desarrolladores y yo nos reunimos para diseñar y crear una nueva herramienta interna y vimos la oportunidad de hacer algo más. A través de ese proceso, nos vimos a nosotros mismos creando algo mucho más sustancial que otra herramienta interna. Meses después, terminamos con una versión preliminar de Bootstrap como una forma de documentar y compartir patrones de diseño y activos comunes dentro de la empresa. [7]
Después de unos meses de desarrollo por parte de un pequeño grupo, muchos desarrolladores de Twitter comenzaron a contribuir al proyecto como parte de la Hack Week, una semana al estilo hackathon para el equipo de desarrollo de Twitter. Se le cambió el nombre de Twitter Blueprint a Twitter Bootstrap y se lanzó como un proyecto de código abierto el 19 de agosto de 2011. [8] Otto, Thornton, un pequeño grupo de desarrolladores principales y una gran comunidad de colaboradores han continuado manteniéndolo. [9]
El 31 de enero de 2012 se lanzó Bootstrap 2, que agregó soporte integrado para Glyphicons, varios componentes nuevos, así como cambios en muchos de los componentes existentes. Esta versión admite el diseño web responsivo , lo que significa que el diseño de las páginas web se ajusta de forma dinámica, teniendo en cuenta las características del dispositivo utilizado (ya sea computadora de escritorio, tableta, teléfono móvil). [10] Poco antes del lanzamiento de Bootstrap 2.1.2, Otto y Thornton dejaron Twitter, pero se comprometieron a continuar trabajando en Bootstrap como un proyecto independiente. [11]
El 19 de agosto de 2013 se lanzó Bootstrap 3, que rediseñó los componentes para utilizar un diseño plano y un enfoque orientado a los dispositivos móviles . [12] Bootstrap 3 incluye un nuevo sistema de complementos con eventos con espacios de nombres . Bootstrap 3 dejó de ser compatible con Internet Explorer 7 y Firefox 3.6, pero hay un polyfill opcional para estos navegadores. [13] Bootstrap 3 también fue la primera versión lanzada bajo la organización twbs en GitHub en lugar de la de Twitter. [14]
Otto anunció Bootstrap 4 el 29 de octubre de 2014. [15] La primera versión alfa de Bootstrap 4 se lanzó el 19 de agosto de 2015. [16] La primera versión beta se lanzó el 10 de agosto de 2017. [17] Otto suspendió el trabajo en Bootstrap 3 el 6 de septiembre de 2016 para liberar tiempo para trabajar en Bootstrap 4. Bootstrap 4 se finalizó el 18 de enero de 2018. [18]
Los cambios significativos incluyen:
Reboot, una colección de cambios CSS específicos de elementos en un solo archivo, basado enNormalizepanel, thumbnail, pagerywellGlyphiconsfuente del iconoBootstrap 4 es compatible con las últimas versiones de Google Chrome , Firefox , Internet Explorer , Opera y Safari (excepto en Windows). Además, es compatible con IE10 y la última versión de soporte extendido de Firefox (ESR). [19]
Bootstrap 5 se lanzó oficialmente el 5 de mayo de 2021. [20] [21]
Los cambios principales incluyen: [22]
Además, varios marcos web admiten la renderización en Bootstrap. [25] [26]
.svg/1280px-Free_and_open-source_software_logo_(2009).svg.png){kind=logo}