Aquí hay muchas preguntas relacionadas con Bootstrap. Veo a mucha gente usándolo. Así que intenté investigarlo, y encontré el sitio oficial de Bootstrap , pero solo había una sección de descarga y unas pocas palabras después de eso. Nada que explique para qué sirve ... Acabo de entender que es un asistente de front-end. Intenté encontrar algo buscando en Google, pero no encontré nada específico. Todo lo que encontré está relacionado con la definición de informática.

Entonces, mis preguntas son:

• ¿Qué es Bootstrap en absoluto?
• ¿Para qué se utiliza y cómo ayuda al desarrollo front-end?
• También me gustaría tener más detalles para explicarlo.

Es un marco de código abierto HTML, CSS y JavaScript (creado inicialmente por Twitter) que puede usar como base para crear sitios web o aplicaciones web.

• Más información y enlaces para descargar

• Empezando

• Ejemplos

• Temas

• Bootply: editor y generador de Bootstrap

Actualizar

El sitio web oficial de bootstrap se actualiza e incluye una definición clara.

"Bootstrap es el marco HTML, CSS y JS más popular para desarrollar primeros proyectos móviles receptivos en la web".

"Diseñado y construido con todo el amor del mundo por @mdo y @fat ".

Bootstrap es un marco Javascript de código abierto desarrollado por el equipo de Twitter. Es una combinación de código HTML, CSS y Javascript diseñado para ayudar a construir componentes de interfaz de usuario. Bootstrap también se programó para admitir tanto HTML5 como CSS3.

También se llama Front-end-framework.

Bootstrap es una colección gratuita de herramientas para crear sitios web y aplicaciones web.

Contiene plantillas de diseño basadas en HTML y CSS para tipografía, formularios, botones, navegación y otros componentes de la interfaz, así como extensiones de JavaScript opcionales.

Algunas razones para los programadores prefirieron Bootstrap Framework

1. Fácil de comenzar

2. Gran sistema de cuadrícula

3. Estilo base para la mayoría de los elementos HTML (tipografía, código, tablas, formularios, botones, imágenes, iconos)

4. Amplia lista de componentes.

5. Complementos Javascript incluidos

Tomado de About Bootstrap Framework

Bootstrap, como lo sé, es un CSS bien definido. Aunque usando Bootstrap también podría usar JavaScript, jQuery, etc. Pero la diferencia principal es que, usando Bootstrap, puede llamar al nombre de la clase y luego obtener el resultado en el formulario HTML. por ej. coloración de botones con forma de texto, usando diseños. Para todo esto, no tiene que escribir un archivo CSS, solo debe usar el nombre de clase correcto para dar forma a su formulario HTML.

En palabras más simples, puede entender Bootstrap como un marco web front-end creado por Twitter para una creación más rápida de aplicaciones web receptivas para dispositivos. Bootstrap también se puede entender principalmente como una colección de clases CSS que se definen en él y que simplemente se pueden usar directamente. Utiliza CSS, javascript, jQuery, etc. en segundo plano para crear el estilo, los efectos y las acciones de los elementos de Bootstrap.

Es posible que sepa que usamos CSS para diseñar elementos de página web y crear clases y asignar clases a elementos de página web para aplicarles el estilo. Bootstrap aquí simplifica el diseño ya que solo tenemos que incluir archivos Bootstrap y mencionar los nombres de clase predefinidos de Bootstrap para los elementos de nuestra página web y se diseñarán automáticamente a través de Bootstrap. A través de esto, nos deshacemos de escribir nuestras propias clases CSS para dar estilo a los elementos de la página web. Lo más importante es que Bootstrap está diseñado de tal manera que hace que el dispositivo de su sitio web responda y ese es el objetivo principal. Otras alternativas para Bootstrap podrían ser: marcos Foundation , Materialise , etc.

Bootstrap lo libera de escribir mucho código CSS y también le ahorra el tiempo que dedica a diseñar las páginas web.

Bootstrap es un marco CSS y JavaScript de código abierto que fue desarrollado originalmente para la aplicación de Twitter por el equipo de diseñadores y desarrolladores de Twitter. Luego lo lanzaron para código abierto. Siendo un usuario de Twitter Bootstrap desde hace mucho tiempo, creo que es uno de los mejores para diseñar sitios web receptivos listos para dispositivos móviles. Muchos complementos CSS y Javascript están disponibles para diseñar su sitio web en poco tiempo. Es una especie de marco de diseño de plantilla rápido. Algunas personas se quejan de que los archivos CSS de bootstrap son pesados ​​y tardan en cargarse, pero estas afirmaciones son hechas por personas perezosas. No tiene que mantener el archivo bootstrap.css completo en su sitio web. Siempre tiene la opción de eliminar los estilos de los componentes que no necesita para su sitio web. Por ejemplo, Si solo usa componentes básicos como formularios y botones, puede eliminar otros componentes como acordeones, etc. del archivo CSS principal. Para comenzar a incursionar en bootstrap, puede descargar las plantillas y componentes básicos degetbootstrap y deja que ocurra la magia.

Descargo de responsabilidad: he usado bootstrap en el pasado, pero nunca antes aprecié lo que realmente es, esta descripción viene de mí llegando a mi propia definición hoy. Y sé que bootstrap v4 está fuera, pero encontré que la documentación de bootstrap v3 es mucho más clara, así que lo usé. La biblioteca no va a cambiar fundamentalmente lo que proporciona.

Brevemente

Bootstrap es una colección de archivos CSS y JavaScript que proporciona un estilo predeterminado atractivo para elementos html estándar y algunos objetos de contenido web comunes que no son elementos html estándar.

Para hacer una analogía, es como aplicar un tema en PowerPoint, pero para su sitio web: hace que las cosas se vean bastante bien sin demasiado esfuerzo inicial.

¿En qué consiste?

La documentación oficial de v3 lo divide en tres secciones:

• CSS
• Componentes
• Javascript

Estos corresponden aproximadamente a las tres cosas principales que ofrece Bootstrap:

• Archivos CSS simples que diseñan elementos html estándar. Entonces, Bootstrap hace que sus elementos estándar se vean bonitos. por ejemplo, html:<input class="btn btn-default" type="button" value="Input">Click me</button>
• Los archivos CSS que usan el estilo en elementos html estándar para convertirlos en algo que no es un elemento html estándar pero es un elemento Bootstrap estándar (por ejemplo, https://getbootstrap.com/docs/3.3/components/#progress ). De esta forma, Bootstrap extiende la lista de elementos web "estándar" de una manera visualmente consistente. por ejemplo, html:<span class="glyphicon glyphicon-align-left"></span>
• Las clases CSS están diseñadas con jQuery en mente. Internamente, Bootstrap utiliza selectores jQuery para modificar los estilos sobre la marcha e interactuar con el DOM, y por lo tanto proporciona al usuario la misma capacidad. Creo que esto requiere más explicación, así que ...

Usando Javascript / jQuery

Bootstrap extiende jQuery bastante. Si miramos el código fuente, podemos ver que usa jQuery para hacer cosas como: configurar escuchas para eventos keydown para interactuar con menús desplegables . Realiza toda esta configuración de jQuery cuando la importa en su <script>etiqueta, por lo que debe asegurarse de que jQuery esté cargado antes que Bootstrap.

Además, vincula el javascript al DOM más estrictamente que jQuery, proporcionando una interfaz de clase javascript . Por ejemplo, alternar un botón mediante programación . Recuerde que CSS simplemente define cómo se ve una cosa, por lo que el trabajo principal de estas operaciones tenderá a modificar qué clases de CSS se aplican al elemento en ese momento. Este tipo de cambio, basado en la entrada del usuario, no se puede hacer con CSS simple.

Hay otras interacciones estándar con un usuario a las que estamos acostumbrados los ciudadanos de Internet que no están cubiertas por CSS. Como hacer clic en un enlace que lo desplaza hacia abajo en una página en lugar de cambiar de página. Una de las cosas que Bootstrap le brinda es una manera fácil de implementar este comportamiento en su propio sitio web.

Normas

He mencionado mucho la palabra "estándar" aquí, y por una buena razón. Creo que lo mejor que proporciona Bootstrap es un conjunto de estándares atractivos. Puede modificar el tema predeterminado tanto como desee, pero es una mejor línea de base que html, css y js sin formato. Y es por eso que se llama "marco".

Los diferentes navegadores web tienen diferentes estilos predeterminados y pueden actuar de manera diferente, y necesitan diferentes prefijos CSS y cosas así. Una de las principales ventajas de Bootstrap es que es mucho más confiable que escribir todas esas cosas entre navegadores (todavía tendrá problemas, estoy seguro, pero es más fácil).

Creo que Bootstrap era más preferido cuando trago y babel no eran tan populares. Mirando Bootstrap parece que viene de un tiempo antes de que todos compilaran su javascript. Sigue siendo relevante, pero ahora puede obtener algunos de los beneficios de otras fuentes.

_{Las versiones más recientes de CSS le han permitido definir transiciones entre estas listas estáticas a medida que cambian. La versión original de Bootstrap en realidad es anterior a la adopción generalizada de esta capacidad en los navegadores, por lo que todavía tienen sus propias clases de animación. Hay algunos bits de Bootstrap que son así: que otras cosas han surgido a su alrededor y lo hacen parecer un poco redundante.}

Bootstrap es un marco HTML, CSS, JS con muchos componentes que le permiten crear sitios web o aplicaciones web hermosos y modernos muy rápidamente.

Los siguientes sitios web contienen ejemplos, elementos y componentes reutilizables que puede integrar en su proyecto utilizando el marco de arranque

bootsnipp.com

startbootstrap.com

bootdey.com

Bootstrap es el marco de código abierto más popular y ampliamente utilizado del mundo para desarrollar con HTML, CSS y JS. Es un marco front-end de HTML. Bootstrap ayuda a crear sitios web o aplicaciones web receptivas y un sistema de cuadrícula de 12 columnas que ayuda a ajustar dinámicamente el sitio web a una resolución de pantalla adecuada. La versión actual de bootstrap es 4.3.1 y el equipo de bootstrap también ha anunciado oficialmente la versión de Bootstrap 5 y cambios como eliminar jquery de bootstrap. Algunas de las razones cruciales por las que el marco de arranque es más preferible son

• Es fácil de usar
• Bootstrap tiene un gran apoyo comunitario
• Las personalizaciones se pueden hacer fácilmente
• Aumenta la velocidad de desarrollo.

• Sensibilidad

  Para más detalles, puede consultar el sitio web oficial: https://getbootstrap.com/

Fuente: https://vmokshagroup.com/blog/bootstrap-advantages/

Según los estándares de hoy en día y la terminología web, diría Bootstrap es, en realidad , no un marco , aunque eso es lo que sus reclamaciones de sitios web. La mayoría de los desarrolladores consideran los marcos Angular, Vue y React, mientras que Bootstrap se conoce comúnmente como una " biblioteca ".

Pero, para ser exactos y correctos, Bootstrap es una colección de código abierto para dispositivos móviles de CSS, JavaScript y HTML diseñada para proporcionar medios para desarrollar elementos web comúnmente utilizados considerablemente más rápido (y más inteligente) que tener que codificarlos desde cero .

Algunos principios básicos que contribuyeron al éxito de Bootstrap:

• es reutilizable
• es flexible (es decir: permite sistemas de cuadrícula personalizados, cambios de puntos de interrupción de respuesta, tamaños de canales de columna o colores de estado con facilidad; como regla general, la mayoría de las configuraciones están controladas por variables globales)
• es intuitivo
• es modular (tanto JavaScript como (S) CSS utilizan un enfoque modular; uno puede encontrar fácilmente tutoriales para hacer compilaciones de Bootstrap personalizadas, para incluir solo las partes que necesitan)
• tiene compatibilidad entre navegadores superior a la media
• Accesibilidad web lista para usar (lector de pantalla listo)
• está bastante bien documentado

Contiene plantillas de diseño y funcionalidad para: diseño, tipografía, formularios, navegación, menús (incluidos menús desplegables), botones, paneles, insignias, modales, alertas, pestañas, plegables, acordeones, carruseles, listas, tablas, paginación, utilidades de medios (incluidos incrustaciones, imágenes y reemplazo de imágenes), utilidades de respuesta, utilidades basadas en color (primario, secundario, peligro, advertencia, información, claro, oscuro, silenciado, blanco), otras utilidades (posición, margen, relleno, tamaño, espaciado, alineación, visibilidad), scrollspy, afijo, información sobre herramientas, popovers.

De forma predeterminada, se basa en jQuery, pero encontrará variantes gratuitas de jQuery impulsadas por cada uno de los marcos de JavaScript progresivos populares modernos:

• Reaccionar-Bootstrap - Reaccionar Bootstrap accionado
• BootrapVue - Bootstrap accionado por Vue
• ng-bootstrap - Bootstrap con motor angular

Trabajar con Bootstrap depende en gran medida de la aplicación de ciertas clases (o, según el marco JS: directivas, métodos o atributos / accesorios) y del uso de estructuras de marcado particulares.

La documentación generalmente contiene ejemplos genéricos que se pueden copiar y pegar fácilmente y usar como plantillas de inicio.

Otra ventaja de desarrollar con Bootstrap es su comunidad vibrante, traducida en una gran cantidad de temas, plantillas y complementos disponibles para ellos, la mayoría de los cuales son de código abierto (es decir, calendarios, selectores de fecha / hora, complementos para la gestión de contenido tabular, como así como bibliotecas / colecciones de componentes creadas sobre Bootstrap, como MDB, plantillas de cartera, plantillas de administración, etc.)

Por último, pero no menos importante, Bootstrap se ha mantenido bien a lo largo de los años, lo que lo convierte en una opción sólida para aplicaciones / sitios web listos para la producción.