Cómo instalar Bootstrap
Bootstrap es un marco web de código abierto. Se utiliza principalmente para el desarrollo front-end. Es gratis. Bootstrap fue desarrollado por Bootstrap Core Team. Bootstrap fue creado originalmente por Mark Otto y Jacob Thornton. Inicialmente fue lanzado en el año 2011. Fue escrito en HTML, CSS y JavaScript.
Paquete Bootstrap
Este paquete contiene los siguientes elementos:
- CSS : se conoce como hoja de estilo en cascada que se utiliza para diseñar los elementos HTML.
- Componentes : en el paquete Bootstrap, hay muchos componentes reutilizables para menús desplegables, iconografía, alertas, navegación, etc.
- Personalizar : en el paquete Bootstrap, los componentes se pueden personalizar, menos variables y complementos de Jquery para obtener el estilo.
- Andamios : en un paquete bootstrap, proporciona la estructura básica con el sistema de cuadrícula, el estilo de enlace y el fondo.
- JavaScript : en un paquete de arranque, habrá complementos de JavaScript.
Pasos para instalar Bootstrap
Discutamos los pasos necesarios para instalar Bootstrap.
Paso 1: utilice el siguiente enlace para descargar bootstrap. Haga clic en Descargar, el paquete de arranque se descargará en una carpeta Zip. Esta carpeta contiene la carpeta CSS y JS.
https://getbootstrap.com/docs/4.0/getting-started/download/
El paquete bootstrap que se descarga está listo para usar código compilado y puede integrarse fácilmente en el proyecto. Consiste en paquetes CSS compilados y minificados y complementos de Javascript.
Paso 2: archivo de origen : Bootstrap se puede compilar con su propia cartera de activos con la ayuda de javascript, sass y archivos de documentación.
Haga clic en Descargar fuente para descargar los archivos. Contiene js, CSS y otros archivos.
Paso 3: Administradores de paquetes: Bootstrap se puede instalar en archivos o aplicaciones con tecnología Node.js.
$ npm install bootstrap
Paso 4: para las aplicaciones de Node.js, bootstrap también se puede instalar con la ayuda del paquete de hilos.
$ yarn add bootstrap
Paso 5: si el usuario desea instalar bootstrap para aplicaciones de ruby gems
- Usando bundler :
gem 'bootstrap', '~> 4.0.0' - Sin paquete :
$ gem install bootstrap –v 4.0.0
Paso 6: El compositor se puede usar para instalar y administrar el bootstraps sass y javascript
$ Composer require twbs/bootstrap: 4.0.0
Paso 7: Usando NuGet, puede instalar y administrar bootstraps CSS y sass y javascript para aplicaciones .Net.
- Bootstrap de paquete de instalación
- Paquete de instalación bootstrap.sass
Paso 8: Jquery también se está utilizando con archivos de arranque o carpeta de instalación. Es necesario descargar Jquery y colocar el archivo Jquery en la carpeta raíz Bootstrap para experimentar la mejor interfaz de usuario y, lo que es más importante, Jquery mejora las características de bootstrap que proporcionan un aspecto más atractivo y receptivo.
Paso 9: Después de ejecutar los pasos anteriores, el desarrollador puede escribir el código HTML para vincular todos los archivos de la página HTML y puede abrir el archivo HTML para verificar la respuesta.
Navegadores Soportados
El programa de arranque admite principalmente la versión más reciente y estable de todos los navegadores y plataformas. El navegador de dispositivos móviles ha sido compatible con la plataforma Android e IOS. Los navegadores de escritorio para diferentes plataformas como Mac y Windows también son compatibles con bootstrap.
Estructura del archivo Bootstrap
- Bootstrap se ha precompilado, la versión compilada de bootstrap se descarga y extrae el archivo Zip y verá la siguiente estructura de archivos:
La figura anterior también incluye los archivos de la carpeta de fuentes si el desarrollador requiere fuentes adicionales para que la interfaz de usuario de acuerdo con los requisitos pueda incluir los archivos que están disponibles en el paquete fuente de bootstrap. El código fuente de bootstrap tendrá una estructura de archivo más detallada.
Bootstrap 4
Hay cambios significativos que se realizan en Bootstrap 4, como reescribir el código principalmente, compatibilidad con el tamaño flexible de CSS, se han agregado opciones de personalización de navegación, se agregan espacios de respuesta y utilidades de dimensionamiento, el tamaño de fuente global se incrementa de 14 px a 16 px, el número de utilidades Se agregan clases, botón de estilo, menús desplegables, objetos multimedia y clases de imágenes. También es compatible con la última versión de los navegadores.
La característica principal de Bootstrap es simplificar el desarrollo de páginas web. La razón principal para usar bootstrap es la elección del color, tamaño, fuente y diseño para proyectar. Proporciona definiciones de estilo básicas para elementos HTML. Los complementos de Jquery y los componentes de Javascript proporcionan algunos elementos adicionales que se pueden usar para la interfaz de usuario, como cuadros de diálogo, información sobre herramientas, etc. Los componentes de arranque también consisten en elementos de HTML, declaraciones CSS y código Javascript. También tiene la característica de extender los elementos de interfaz existentes.
El otro componente principal de bootstrap son sus componentes de diseño. El componente de diseño básico se denomina contenedor en el que se colocan todos los elementos de la página. El contenedor se coloca en la página web, luego otros componentes de diseño como el diseño CSS se pueden definir a través de filas y columnas. Depende del desarrollador elegir qué contenedor de ancho fijo o contenedor de ancho de fluido para diseñar la página web. El primero usa los cuatro anchos predefinidos, pero luego usa los rellenos dependiendo del tamaño de la pantalla en la que se está viendo la página web.
Uso de bootstrap
Bootstrap es muy fácil de usar y con la ayuda de bootstrap, los desarrolladores solían desarrollar sitios web receptivos. Bootstrap también se usa, ya que admite muchos navegadores como Google Chrome, Mozilla Firefox, Internet Explorer, safari, opera, etc. Bootstrap es fácil de comenzar y de crear un sistema de cuadrícula receptivo. Ha incluido complementos de JavaScript y hay una lista de empresas para usar. Tiene buena documentación para comenzar y puede funcionar rápidamente. Bootstrap ha demostrado un diseño receptivo y un primer enfoque móvil. Es de código abierto y gratuito. Ahorra mucho esfuerzo y tiempo. Es personalizable El uso importante de bootstrap es el diseño web receptivo, que ayuda a ajustar el sitio web de acuerdo con el tamaño de la pantalla para todos los dispositivos como computadora portátil, computadora de escritorio, teléfono móvil y tableta.
Conclusión: cómo instalar Bootstrap
Bootstrap se está utilizando ampliamente como un marco web front-end. Es compatible con muchos lenguajes de programación y plataformas independientes también. Cuenta con un excelente soporte comunitario en línea para que los principiantes puedan ayudar y la documentación también es buena en el sitio oficial donde todas las actualizaciones relacionadas con el lanzamiento de una nueva versión y las funciones avanzadas se han publicado y documentado correctamente. Se ha convertido en el marco web popular para crear diferentes herramientas e integrarse con otro lenguaje de secuencias de comandos.
Artículos recomendados
Esta ha sido una guía sobre cómo instalar Bootstrap. Aquí hemos discutido los pasos para instalar Bootstrap y también el concepto básico de Bootstrap 4 y el uso de Bootstrap. También puede consultar los siguientes artículos para obtener más información:
- Cómo usar los comandos de Bootstrap
- Preguntas de la entrevista Bootstrap con respuestas
- Comparaciones de Bootstrap y WordPress
- Instalación de WordPress