Curso de Frontend con Bootstrap y Foundation 2016

Toma las primeras clases gratis

COMPARTE ESTE ARTÍCULO Y MUESTRA LO QUE APRENDISTE

Hola a Todos, este Tutorial dirigido a todo aquel que quiere aprender Bootstrap 4 en el 2018!!!

Les dejo aqui una serie de Tutoriales que ayudaran a crear la misma pagina que hizo Sasha (PlatziShop) y todos los pasos que el mismo siguio pero con toda la información que hay de Bootstrap 4 hasta Enero del 2018.

Primero que nada, veras informacion variada y como realizar la mayor parte de las cosas en este proyecto en el cual tambien dejare el link de la misma pagina de bootstrap donde encuentras ese apartada.

Muy Bien, a lo que venimos, para empezar, Boostrap 4 de Enero de 2018 es algo diferente al bootstrap 4 que nos muestra Sasha, ahora bootstrap viene con flexBox incluido en su ultima version, ademas ya incluya una serie de librerias de jquery y de Css que utiliza el mismo bootstrap 4.
La verdad a mi no me parece que se deba modificar cosa alguna, con lo que ofrecen hasta el momento es mas que suficiente, pero si tu quieres tambien puedes aplicar unas que otras modificaciones, solo Investiga un poco!! por que aqui yo no te lo voy a enseñar!

Para Emepzar, Bootstrap 4 nos da una plantilla inicial con la que podemos iniciar cualquier proyecto y es este:

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
  </body>
</html>

https://getbootstrap.com/docs/4.0/getting-started/introduction/

En este Punto, tambien recomiendo agregar Jquery y alguna fuente de Iconos (La verdad yo si los agrego por que quiero evitar la fatiga a futuro) como Iconmoon o Font Awesome.

Ya teniendo nuestra plantilla con nuestro Bootstrap “Instalado” ya podremos comenzar a utilizar las famosisimas clases de bootstrap.

Si todo Salio Bien, tu primera impresión de ese Template en la web sera algo asi:

"Hola Mundo"

Y listo, ya pasaremos a seguir con el proyecto.

Curso de Frontend con Bootstrap y Foundation 2016

Toma las primeras clases gratis

COMPARTE ESTE ARTÍCULO Y MUESTRA LO QUE APRENDISTE

0 Comentarios

para escribir tu comentario

Artículos relacionados