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 Amazon AWS CompTIA Security+ 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 Mindfulness Personal Transformation 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 Online Business Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
Development Web Development Bootstrap

Bootstrap 4 From Scratch With 5 Projects

Master Bootstrap 4 and build 5 real world themes while learning HTML5 semantics & CSS3
Bestseller
Rating: 4.7 out of 54.7 (14,028 ratings)
58,074 students
Created by Brad Traversy
Last updated 6/2018
English
English [Auto], French [Auto], 
30-Day Money-Back Guarantee

What you'll learn

  • Learn and create amazing high quality Bootstrap 4 themes and UIs from scratch
  • Learn the Bootstrap 4 utilities, classes, components & JS widgets using a custom sandbox environment
  • Learn semantic HTML5 & modern CSS3 techniques
  • Learn to compile Sass in the easiest way possible using a GUI
Curated for the Udemy for Business collection

Course content

11 sections • 74 lectures • 11h 21m total length

  • Preview04:47
  • What Is Bootstrap & Why Use It?
    Preview07:20
  • What's New In Bootstrap 4?
    05:23
  • Initial Environment Setup
    08:58
  • Preview05:50

  • Section Introduction
    02:28
  • Headings & Basic Typography
    09:14
  • Text Alignment & Display
    09:23
  • Floats & Fixed Positions
    06:15
  • Colors & Background
    09:08
  • Margin & Padding Spacing
    10:28
  • Sizing & Borders
    06:53
  • CSS Breakpoints
    05:26

  • Section Intro
    02:18
  • Buttons & Button Groups
    14:48
  • Navbar & Navs
    21:21
  • List Groups & Badges
    08:45
  • Forms & Input
    13:12
  • Input Groups
    08:09
  • Alerts & Progress Bars
    09:39
  • Tables & Pagination
    09:47
  • Working With Cards
    21:16
  • Media Objects
    07:54
  • Jumbotron
    04:17

  • Section Introduction
    02:09
  • Grid System
    16:56
  • Grid Alignment
    06:01
  • Flexbox Classes
    09:18
  • Auto Margin, Wrap & Ordering
    03:40

  • Section Introduction
    01:31
  • Carousel Slider
    16:10
  • Collapse & Accordion
    07:17
  • Tooltips
    08:39
  • Popovers
    06:38
  • Modals
    06:56
  • ScrollSpy & Smooth Scolling
    07:34

  • Creating The Boiler
    06:13

  • Preview02:42
  • Setup & Navbar
    07:18
  • Home Section Area
    18:51
  • Explore Section Area
    09:37
  • Create & Share Section Areas
    07:36
  • Footer, Contact Modal & Menu Smooth Scroll
    10:24

  • Preview02:46
  • Setting Up Sass With Koala
    10:55
  • Custom Navbar & Logo
    09:34
  • Showcase & Primary Color Change
    06:40
  • Newsletter & Boxes
    14:20
  • About Section With Accordion
    07:12
  • Authors Area
    09:39
  • Contact & Footer
    11:27

  • Preview03:20
  • Showcase With Carousel
    20:07
  • Home Icons, Heading & Info Sections
    11:30
  • Video Section With Autoplay Modal
    08:57
  • Photo Gallery & Newsletter
    13:15
  • Page Header & About Section
    10:42
  • Icon Boxes & Testimonial Slider
    10:21
  • Services Page With FAQ Accordion
    13:32
  • Blog Page With Cards
    09:54
  • Contact & Staff Sections
    12:57

  • Preview03:53
  • Navbar & Main Header
    10:20
  • Add Buttons & Modals
    15:41
  • Finishing The Dashboard
    12:06
  • Resource Table Pages
    12:16
  • Details & Settings Pages
    11:39
  • Profile & Login Page
    12:35

Requirements

  • You should have basic knowledge of HTML & CSS
  • You do NOT need to know any Bootstrap 3

Description

This course will literally take you from knowing nothing about Bootstrap 3 or 4 to learning all of the utilities, components, widgets and grids and building real world themes and websites. You do NOT need to know Bootstrap 3 for this course. Even if you already know Bootstrap 4, skip the learning sections and head right for section 6 to create the simple boiler theme and start the projects. Everything is completely modular!

Custom Bootstrap Sandbox

I have created a completely custom HTML learning environment for the first few sections of this course. Each lecture has an html page associated with it and has a start state. As we move along through the lectures, you code along with me learning all that Bootstrap 4 offers including helpers/utilities, components, widgets, flexbox and more.

5 Real Projects/Themes

We will create 5 real world themes including. These projects are completely open source and you are free to use them anywhere.

  1. LoopLap - A social UI Theme
  2. Mizuxe - A Book/Product Showcase Theme (Sass Project)
  3. Blogen - A blog admin area UI
  4. Glozzom - A multi page theme with a carousel and some 3rd party scripts
  5. Portfoligrid - A portfolio theme using the grid, flexbox and the collapse widget

Who this course is for:

  • Anyone that wants to learn & master Bootstrap 4.1.x and build real world themes

Featured review

Eliana Hebrew
Eliana Hebrew
126 courses
18 reviews
Rating: 5.0 out of 57 months ago
If I could give this course AND instructor 20 stars I would! This course is thorough in explaining the elements of bootstrap.I love that before you start coding projects he walks you through EACH bootstrap feature and you create your own sandbox of the features to come back to if you forget what they do. The websites he builds during the class are also great and can even be used , if you know the backend and JS. If you are looking to learn bootstrap-TAKE THIS COURSE!!!

Instructor

Brad Traversy
Full Stack Web Developer & Instructor at Traversy Media
Brad Traversy
  • 4.7 Instructor Rating
  • 106,830 Reviews
  • 275,111 Students
  • 15 Courses

Brad Traversy has been programming for around 12 years and teaching for almost 5 years. He is the owner of Traversy Media which is a successful web development YouTube channel and specializes in everything from HTML5 to front end frameworks like Angular as well as server side technologies like Node.js, PHP and Python. Brad has mastered explaining very complex topics in a simple manner that is very understandable. Invest in your knowledge by watching Brad's courses.

  • 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.