Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA CompTIA Security+ Amazon AWS Microsoft AZ-900
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Personal Development Personal Transformation Mindfulness Life Purpose Meditation CBT Emotional Intelligence
Web Development JavaScript React CSS Angular PHP Node.Js WordPress Vue JS
Google Flutter Android Development iOS Development React Native Swift Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Retargeting
Microsoft Power BI SQL Tableau Business Analysis Data Modeling Business Intelligence MySQL Data Analysis Blockchain
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Business Plan Startup Freelancing Online Business Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
2021-03-13 13:25:10
30-Day Money-Back Guarantee
Development Web Development Bootstrap

Bootstrap 5! Curso completo desde 0! incluye Sass y Firebase

Aprende a desarrollar páginas web responsives (mobile first) con Bootstrap 5 [Rápido y Fácil], El Framework más Popular!
Hot & New
Rating: 4.5 out of 54.5 (45 ratings)
286 students
Created by Ignacio bluuweb
Last updated 4/2021
Spanish
Spanish [Auto]
30-Day Money-Back Guarantee

What you'll learn

  • Desarrollo web con Bootstrap 5
  • Crear páginas web Responsives adaptables a celulares, tablet y computadoras de escritorio
  • Subir páginas web a hosting gratuitos
  • Trabajar con Firebase, Autenticación con Google y Firestore (bases de datos en tiempo real)
  • Utilizar componentes de Bootstrap y entender su funcionamiento
  • Utilizar Sass para la personalización de Bootstrap 5

Course content

12 sections • 154 lectures • 11h 48m total length

  • Preview06:12
  • Bienvenida y estructura del curso
    03:15
  • Guía por bluuweb
    02:30
  • Preguntas y Respuestas
    04:23
  • ¿Me faltó algo? Siempre se puede mejorar...
    01:04
  • Visualizar en 1080p
    00:10

  • Recomendaciones: VSC, Extensiones y GetBoostrap.com
    04:06
  • Estructura básica con Booststrap 5
    05:51
  • Breakpoints
    01:08
  • Container
    04:22
  • Grid - Sistema de Columnas
    10:56
  • Grid Responsive (opciones o puntos de quiebre)
    11:35
  • Grid - Columns (Flexbox)
    06:23
  • Border
    06:52
  • Colores
    03:42
  • Sombras
    01:22
  • Margen y Padding
    07:11
  • Textos posicionamiento
    01:16
  • Typography
    03:52
  • Imágenes responsives
    01:46
  • Descarga los archivos de esta sección aquí
    00:02

  • Preview01:53
  • Configuración base (CDN en index.html)
    02:29
  • Agregando Título (display-4) y párrafo (lead)
    04:07
  • Grid Responsive
    03:37
  • Estructura HTML5
    06:04
  • Border
    01:55
  • Contenido de nuestros precios
    05:59
  • Elementos de línea y bloque (d-block)
    05:35
  • Flexbox (d-flex)
    10:35
  • CSS media queries
    05:23
  • Subir proyecto a Hosting gratuito
    03:26
  • Archivos Terminados de esta sección
    00:02

  • Starter Template
    04:13
  • Buttons
    12:40
  • Botón de Bloque
    06:53
  • Alert
    08:03
  • Badge
    05:11
  • Card + Img top
    06:41
  • Card + Listas
    05:18
  • Card + Grid (sistema de columnas)
    05:05
  • Collapse
    07:40
  • Accordion
    18:42
  • Dropdowns
    03:01
  • Modal
    07:05
  • Modal (variaciones)
    04:59
  • Navbar o menú de navegación
    03:14
  • Navbar Responsive
    06:42
  • Carousel o Slider
    04:09
  • Carousel con controles de navegación
    03:53
  • Carousel controles inferiores
    02:05
  • Caroulsel con textos responsives
    02:40
  • Spinners
    02:12
  • Popovers
    03:53
  • Tooltips
    01:29
  • Archivos Terminados de esta sección
    00:02

  • Preview00:54
  • Starter Template
    02:05
  • Navbar Fixed Top
    11:45
  • TIPS: Aria Current
    00:50
  • Carousel
    10:15
  • Iconos de Bootstrap
    08:24
  • Section Main
    05:31
  • Alinear verticalmente
    01:01
  • Configurando Grid
    08:17
  • Section Accordion
    02:35
  • Section Card
    09:58
  • Modals
    08:17
  • Footer
    01:03
  • Scrollspy
    06:15
  • Subir proyecto a Hosting gratuito
    02:00
  • Archivos Terminados de esta sección
    00:02

  • Formularios con Bootstrap 5 [Presentación]
    03:24
  • Starter Template
    02:27
  • Múltiples páginas HTML
    03:53
  • Primeros pasos con Formulario (email)
    07:21
  • Input Password
    02:26
  • Botón de tipo "submit"
    04:31
  • Curso de Javascript (opcional)
    00:10
  • Comenzando a trabajar con Javascript
    09:16
  • Leer input con Javascript
    04:33
  • Input Checkbox
    02:54
  • Botón "Loading" con clases dinámicas
    09:39
  • Componente Toast
    08:04
  • Recomendaciones de Tutoriales
    01:34
  • Procesar Formulario con PHP
    00:16
  • Archivos Terminados de esta sección
    00:02

  • Preview01:30
  • NPM - Instalar Bootstrap 5
    10:09
  • Compilar Sass a un archivo CSS
    08:45
  • Live Sass: ¿No genera carpeta CSS?
    00:09
  • Vincular archivo JS
    03:07
  • Cambiar colores principales de Bootstrap
    05:45
  • Cambiar la tipografía o fuente
    04:50
  • Utilizar "all colors" de Bootstrap 5
    03:14
  • Subir proyecto a Hosting gratuito
    02:23
  • Archivos Terminados de esta sección
    00:05

  • Instalación de Sass con Bootstrap 5
    04:55
  • custom.scss (personalizando Bootstrap)
    02:59
  • Navbar personalizado con Sass
    06:12
  • Min-width con Sass (Breakpoints)
    06:27
  • Activar márgenes negativos en Bootstrap
    04:51
  • Progress bar (componente)
    04:20
  • Navbar en diferentes páginas HTML
    03:11
  • Card responsive
    03:51
  • Presentación validación de Formularios
    02:47
  • Formulario con validaciones (clases CSS)
    14:03
  • Formulario con validaciones (Javascript)
    03:40
  • Subir proyecto a Hosting gratuito
    03:20
  • Archivos Terminados de esta sección
    00:05

  • Preview01:11
  • Instalación de Bootstrap 5 (NPM)
    02:48
  • Cambiar la tipografía o fuente (SCSS)
    01:34
  • Card centrada horizontalmente
    03:30
  • Ordenar columnas (order responsive)
    09:21
  • Finalizando Card
    03:08
  • Detectar form range con Javascript
    04:24
  • Precio dinámico con Javascript
    02:46
  • Views dinámico con Javascript
    03:15
  • Subir proyecto a Hosting gratuito
    01:37
  • Archivos Terminados de esta sección
    00:05

  • Preview01:53
  • Starter Template
    01:01
  • Configurar Firebase
    11:18
  • Vincular Firebase con Bootstrap
    04:05
  • Contenido estático
    09:08
  • Seleccionando ids
    03:53
  • Detectar usuario registrado (onAuthStateChange)
    06:38
  • Registrar nuevo usuario en Firebase
    05:39
  • Pintar nombre de usuario registrado
    01:43
  • Agregar los mensajes de chat a Firestore
    08:06
  • Pintar Chat en tiempo real (onSnapshot)
    11:54
  • Reglas de seguridad Firestore
    03:22
  • Hosting Firebase
    07:09
  • Archivos Terminados de esta sección
    00:02

Requirements

  • HTML y CSS básicos
  • Javascript básico

Description

Con Bootstrap 5 podrás acelerar tu desarrollo web y crear páginas web adaptables a múltiples dispositivos, en este curso aprenderás:

  • Aprende a instalar Bootstrap 5 a través de CDN o NPM

  • Fundamentos de Bootstrap 5 utilizando su Grid System (creación rápida de páginas web responsives)

  • Utilidades: Conoce como aprovechar todas sus clases ya pre-configuradas como colores, margenes, bordes, textos, etc.

  • Flexbox: Aprende a diseñar y posicionar tu contenido web.

  • Componentes: Bootstrap posee una gran cantidad de componentes listos para ser utilizados, en el curso veremos paso a paso cada uno de ellos y como podemos utilizarlos en nuestros desarrollos web.

  • Aprende a utilizar Iconos de Bootstrap!

  • Prácticas: Crearemos diferentes páginas web para utilizar todo lo aprendido, así cada conocimientos quedará guardado en tu cerebro.

  • Subiremos cada proyecto a Hosting gratuitos para que puedas compartir tus desarrollos.

  • Aprenderemos a utilizar Sass para personalizar Bootstrap de una manera muy sencilla.

  • Finalmente conoceremos Firebase para llevar nuestro desarrollo web al siguiente nivel con bases de datos en tiempo real.

Empieza a utilizar Bootstrap, el marco de trabajo más popular del mundo para crear sitios receptivos y móviles.

Diseñe y personalice rápidamente sitios receptivos para dispositivos móviles con Bootstrap, el kit de herramientas de código abierto de front-end más popular del mundo, que presenta variables y mixins de Sass, sistema de cuadrícula receptivo, amplios componentes prediseñados y potentes complementos de JavaScript.

Mucha energía y nos vemos en el siguiente video tutorial!

Who this course is for:

  • Desarrolladores web que deseen crear páginas web responsives de manera fácil y sencilla.

Instructor

Ignacio bluuweb
Programador y Fundador de bluuweb!
Ignacio bluuweb
  • 4.6 Instructor Rating
  • 8,056 Reviews
  • 97,971 Students
  • 7 Courses

Hola, soy bluuweb! (Ignacio Gutiérrez) un canal en Youtube que trata de proporcionar la mejor energía para enseñar a programar, si estás listo para aprender no dudes en darme una oportunidad :)

Mi principal objetivo es que puedas aprender sin quedarte dormido en el proceso, desarrollo muchas prácticas para aterrizar lo aprendido y estar siempre mostrando la documentación oficial para entusiasmar el hambre de seguir aprendiendo juntos.

Nos vemos en el siguiente video tutorial!

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Impressum Kontakt
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.