![Bootstrap 3 [Tutorial]](https://storage.posteamelo.com/assets-adonis/assets/2014/10/22/F91.jpg-5VgL9YYcuxd.webp)
A continuación una serie de Tutoriales de Bootstrap 3 (El Framework CSS de Twitter, que si te gusta la programación web tenes que aprender)
Vamos a los bifes:
(como decimos los Argentinos, en otros países se dice "al grano", pero nosotros preferimos la carne )
Título: Introducción.
Sinopsis: En esta oportunidad tratare la introducción a Twitter Bootstrap 3. Este video es el comienzo de toda una guía, que estamos preparando para ustedes.
En este primer video veremos:
¿Qué es Twitter Bootstrap?
Origen
Características
Ejemplos de paginas creadas con este framework
y las Herramientas para empezar a crear un Proyecto.
Video:
Título: Prototipado e inicialización del proyecto
Sinopsis: En esta guía explicamos en que consiste el prototipado, su importancia y mostramos varios ejemplo de manera didáctica.
Juntos creamos un propio mockup (wireframing, maqueta, prototipado, etc), el cual será el proyecto que se desarrollará paso a paso en cada guía.
Video:
Título: Sistema de rejillas (grid system) y container en Bootstrap 3.
Sinopsis: En esta guía se explican el uso de las grillas y de contenedores para la ubicación de los elementos, se aplica brevemente responsive web design en grid system.
Video:
Título: Aplicando grid system (sistema de rejillas)
Sinopsis: En esta guía se realiza a nivel de código el maquetado de nuestro proyecto (página) haciendo uso de diversos Containers y del Grid System, también se hace uso de las diversas bondades de sublime text, que nos facilita la manipulación de código.
Video:
Título: Header con Twitter Bootstrap 3
Sinopsis: En esta guía se da comienzo a la creación de los componentes de nuestra pagina, como inicio elaboramos nuestro header, haciendo uso de tipos de letras como las de google fonts como también hacemos uso de imagines, para una buena presentación de nuestra pagina como debe ser todo desarrollo front end.
Video:
Título: Barra de navegación y Menú
Sinopsis: Otro elemento bastante típico y común en muchas páginas web es la zona de navegación, formada por enlaces a las zonas principales de la web, o por un menú de navegación, desplegable de enlaces, etc.
En esta guía creamos nuestra barra de navegación que tendrá la característica de ser responsiva.
Material y Código:
https://github.com/DevCodela/Guia-Bootstrap-3
Video:
Título: Slider (Carousel)
Sinopsis: En esta guia creamos nuestro slider o también llamado carrusel, el cual se suele introducir como una forma de destacar contenidos y que tenga dinamismo la web.
Recordar que pueden personalizarlos como ustedes gusten, existen diversos diseños con sus respectivos efectos que nos trae este gran framework como lo es Bootstrap 3.
Material y Código:
https://github.com/DevCodela/Guia-Bootstrap-3
Video:
Título: Contenidos personalizados - imágenes
Video:
Título: Contenidos personalizados: Video y footer
Sinopsis: Con esta guía damos por concluido la guía del framework bootstrap 3. Terminamos de crear los demás elementos de manera muy didáctica, video responsivo y se muestra las bondades del plugin Emmet, que nos ayuda a que la codificación sea mas fácil, el uso de multi-cursores y más.
Material y Código:
https://github.com/DevCodela/Guia-Bootstrap-3
Video:
¡Excelente trabajo de los muchachos de DevCode!
http://devcode.la/
https://twitter.com/DevCodela
http://es.wikipedia.org/wiki/Twitter_Bootstrap
(Lo comparto porque me pareció realmente muy bueno, y no lo encontré posteado aún)
Espero que les sea de utilidad...
¡Saludos!
* Porfavor no hacer comentarios ofensivos