Crea una cuenta o inicia sesi贸n

隆Contin煤a aprendiendo sin ning煤n costo! 脷nete y comienza a potenciar tu carrera

Nuestro Proyecto: Hola Mundo de Bootstrap

4/21
Recursos

Vamos a sitio web oficial de Bootstrap en getbootstrap.com . Cualquier duda que tengas sobre los componentes y su uso que no se respondan en este curso, lo puedes encontrar en la secci贸n de Documentation del sitio de Bootstrap.

Aportes 51

Preguntas 6

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

Aqu铆 el update de Bootstrap v5.2 馃檵馃徎鈥嶁檪锔

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- CSS only -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
    <title>Document</title>
</head>
<body>
    <h1>Test Bootstrap 5.2</h1>
    <!-- JavaScript Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
</body>
</html>

Apuntes:
Para acceder a usar Bootstrap, nos dirigimos a la pagina https://getbootstrap.com/ y podemos descargar la carpeta que contiene toda la usabilidad del framework (HTML, CSS JS) o simplemente podemos agregar los enlaces CDN para su uso.
Enlace de descarga y CDN: https://getbootstrap.com/docs/4.3/getting-started/download/

Bootstrap tambi茅n se puede descargar por medio de Composer.

Hola comunidad!!
interesados en crear un grupo de wsp para consultar todo tipo de cuestiones front end comenten!
Otra consulta
bootstrap es una herramienta vigente?
pregunto porque vi que tiene usos con jquery pero no se mucho sobre este framework

Alguna extencion de Bootstrap para vsCode

Pregunta en que casos es bueno usar CDN, Descargar los archivos o utilizar un manejador de paquetes como NPM?

para iniciar esta bien llamar la libreria por cdn, luego agregarias los .min necesarios

Ya esta disponible la versi贸n 4.5 Bootstrap:
https://getbootstrap.com/docs/4.5/getting-started/download/

Actualmente ya esta la versi贸n 4.2

ya de inicio parece facil, haber que tal, me gusta mucho usar css, pero estoy aprendiendo esto para hacer cosas mas rapido!

Grande Mangel Rogel!

Hola gente! Es clave saber y comprender que por m谩s que el curso sea de Bootstrap 4, y hoy en d铆a exista Bootrstrap 5.3.
Este framework css, funciona igual鈥
Es decir que el sistema de grillas se implementa de la misma forma que en la version 4, existen diferencias en otras cosas como nuevos componentes por parte de la version 5, etc鈥
A lo que voy, es que de todas formas, aprendes a pesar de ser un curso desactualizado!

Versi贸n 5.3

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap demo</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
  </head>
  <body>
    <h1>Hello, world!</h1>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
  </body>
</html>

Que viejo es este tutorial por favor!
Esta usando Atom, ni sus creadores lo usan ya.

Bootstrap ya esta en la version 5.2 en Beta de preferencia sigan con la 4.6 que esta por la parte de abajo. Por si se pierden en la nueva landing

si estas aprendiendo a utilizar bootstra los mas recomendable es utilizar la version que utiliza el profe por que es 4.1 porque si usamos la version 5.0 que es la ultima que versi贸n abr铆a varios inconveniente este seria mi aporte鈥

Aui les dejo la documentacion para usar bootstrap con webpack
https://getbootstrap.com/docs/5.0/getting-started/webpack/

Gran clase

aparece Bootstrap en la versi贸n 5 es lo mismo?

f

Excelente Observaci贸n

listo ya鈥! para iniciar鈥!

De diez!!!

genial, pens茅 que seria un poco m谩s dif铆cil utilizar este framework

De Diego Rivera

Ser谩 la primera vez que aprender茅 a usar Bootstrap. Vamos con todo!

listo para comenzar

Interesante!

Recomiendo leer bastante la documentaci贸n de Bootstrap durante el transcurso del curso, es bastante sencilla.

te ahorra bastante cosas

VEAMOS EN QUE APORTA!

Cree sitios r谩pidos y adaptativos con Bootstrap. Se puede crear y dise帽ar r谩pidamente sitios 鈥Responsive鈥 para dispositivos m贸viles con Bootstrap, el kit de herramientas de c贸digo abierto front-end m谩s popular del mundo, que presenta variables y mixins Sass, sistema de cuadr铆cula sensible, componentes precompilados extensos y complementos potentes de JavaScript.

Genial

Excelente!

馃挌

Excelente curso, muy motivado para continuar ya que debo crear un tema para un sitio construido en Drupal 8(CMS php) y el nuevo template usara Bootstrap 4.

Muy buena practica siempre al usar cualquier herramienta, irnos a su documentaci贸n oficial para sacarle el mayo provecho.

鉂わ笍

Excelente introducci贸n con 4 v铆deos, ahora si vamos al c贸digo.

Bootstrap facilita la maquetaci贸n de sitios web, adem谩s de ser compatible con preprocesadores como Less y Saas, nos ofrece las herramientas para que nuestro sitio web se vea bien en toda clase de dispositivos, ahorr谩ndonos as铆 el trabajo de tener que redise帽ar un sitio web.馃榿

Fant谩stico!

Mi editor de c贸digo favorito es visual studio code 馃槂

El sitio oficial de Bootstrap lo usaremos como referencia para saber como vamos a usar los componentes, que HTML necesitamos, si necesitamos estilos y JS

sigamos 馃槃

Gracias por el dato del js.

Vamos a sitio web oficial de Bootstrap en Official Page . Cualquier duda que tengas sobre los componentes y su uso que no se respondan en este curso, lo puedes encontrar en la secci贸n de Documentation del sitio de Bootstrap.

Copiar el template de 鈥渟tarter template鈥. Pegarlo en un archivo index.html. Abrir el archivo en el navegador


Con toda a aprender

No he hecho nada y ando mas emocionado!!!

exelente aporte

listo!