Bootstrap

Clase 13 de 15 • Curso de Introducción a Librerías UI con React

Brayan Lopez

student•

El profesor tiene una equivocación cuando comenta la forma en la que se debe incluir Bootstrap en un proyecto en React. Él dice que se debe incluir usando NPM y además se debe poner las líneas en la raíz de HTML. Pero estos dos formas de instalarlo son independientes, no es necesario hacer ambas al tiempo. Usando NPM se instala como una dependencia y Bootstrap estaría disponible desde la carpeta node_modules, luego para importarlo en el proyecto se debe importar en el archivo donde se quiera usar usando: import "bootstrap/dist/css/bootstrap.min.css" Por otro lado las líneas se usan cuando no se quiere usar como dependencia, ni descargar nada, entonces se carga Bootstrap desde un CDN (Content Delivery Network) y cada vez que se ejecute el proyecto el ira a traerlo desde el CDN. Es muy útil cuando se está empezando y no se quiere usar NPM. En resumen, son dos métodos diferentes y no es necesario usarlos al tiempo.

Alejandra Espinosa

student•

Gracias por la aclaración!!

Daniel Rodrigo Valdivieso Merino

teacher•

😊 Gran punto Brayan, tienes razón no es obligatorio descargalo, puede utilizarce desde un CDN.

🤔 Sin embargo, por buenas prácticas las dependencias deben instalarse en el proyecto ya sea con npm o yarn.

🫶 ¿Para qué?, para que desde el archivo package.json se pueda tener control de las dependencias, el tipo de dependencia y la version de estas dependencias.

💚 Saludos

Victor Manuel Sarria Salinas

student•

https://codesandbox.io/s/

Luis Hernando Sendoya Serrato

student•

es gratuito?

Raul Contreras

student•

Es gratis

Juan Camilo Lentino Villalba

student•

React-Boostrap combina lo mejor de ambos mundos, la potencia de React y sus props, y los estilos ya definidos de Boostrap, agiliza muchísimo el desarrollo y el código se ve mucho mas limpio, es una muy buena librería y otra opción mas a tener en cuenta a la hora de implementar bibliotecas UI y realizar un proyecto dependiendo los requerimientos.

Daniel Reyes

student•

No había usado Bootstrap. A ver si entiendo, vienen los componentes listos, ya armados con clases de solo pegarlos al componente de react en el que los vaya usar? Es como si ya hubiesen archivos CSS precargados con esta librería (que de hecho, seria el link que puse en un principio en el html)?

Joel Dominguez Merino

student•

Si, así es. Bootstrap al ser un framework o "marco de trabajo" te brinda la documentación donde puedes obtener componentes ya armados (etiquetas HTML con sus estilos) para que solo copies y pegues o simplemente para que tu puedas construir tus propios componentes con las clases que ya tiene definido el.

Marco Antonio Alducin Garcia

student•

Por eso me encanta Bootstrap, porque me da una facilidad en cuanto a la forma de manipular y adaptar los componentes de una forma sencilla, viendo los nombres de las clases para poder cambiarlo a nuestras necesidades.

Gilbert Ardila

student•

Bootstrap me gusta, lo único es que si necesitas cambiar algo de los estilos es un imposible, habría que usar !important y no siempre funciona

Bootstrap

Introducción al curso

Bienvenida al curso

¿Qué es UI?

¿Qué es una librería UI?

¿Por qué una libreria UI?

¿Por qué usar una librería UI?

Beneficios al usar una librería UI

Tiempo de Desarrollo

Iteración del Proyecto

Escalabilidad del Proyecto

Dinero

Conclusión del modulo

Librerias UI

Tipos de librerias UI

Styled Components

Bootstrap

Material UI

Despedida

Resumen del curso