MasterStudy > Design > Web Design > The Complete Bootstrap 4 Guide: Beginner to Advanced
4.83 out of 5
4.83
96 reviews on Udemy

The Complete Bootstrap 4 Guide: Beginner to Advanced

Build beautiful websites faster & easier using Bootstrap 4 (v4.3.1). Learn HTML, CSS, SASS, Flexbox, & Responsive Design
Instructor:
Andrew Whitworth
444 students enrolled
English [Auto]
Master every Bootstrap 4 class name using my custom Bootstrap Playground.
Build projects using Flexbox.
Create beautiful websites in the project section.
Discover and understand advanced topics such as SASS & SCSS
Know what you are building and why.
Quickly compare your code to mine.
Friendly and fast support in the course Q&A Section.

UPDATE: This course now includes 2 hours of new content entirely based on Advanced Topics such as SASS and SCSS. It is also updated to the latest version of bootstrap.

Welcome to The Complete Bootstrap 4 Guide, the only course you need to learn Bootstrap 4. There are a lot of ways to learn Bootstrap 4, but this course is without a doubt the most comprehensive and effective way to learn the latest version of Bootstrap. Here’s why: 

  • This course was carefully planned and took over 8 months to create

  • Everything I cover is up-to-date and relevant using only the latest version of Bootstrap 4 – version 4.3.1 final release (not an alpha or beta version)

  • I built a special Bootstrap Playground where you can quickly learn all of the Bootstrap Classes and Components.

  • The course is constantly updated with new content, projects, and lectures. Feel free to offer suggestions of what else you would like to see.

  • Don’t be a code monkey, actually understand WHY we are doing something

Why should you learn Bootstrap? 

It is the fastest way to build websites without having to re-invent the wheel. When building a website there is a lot of repeated code such as what a button looks like or how to make a website responsive. There are countless other examples, but all you need to know is that it makes your life a whole lot easier, especially if you are a junior web developer. 

Throughout this course we cover tons of tools and technologies including: 

  • HTML5

  • CSS3

  • Bootstrap 4 (4.3.1)

  • Flexbox

  • Responsive Design

  • SASS & SCSS

This course is also unique in the way that it is structured and presented. Many times instructors just show you the Bootstrap 4 documentation or worse they just jump right in and expect you to learn it along the way. This course is different. I have built a custom site called the Bootstrap Playground which allows you to:

  • Quickly learn the Bootstrap 4 class names

  • Be able to differentiate between the different Bootstrap 4 components

  • Play around with Bootstrap without a lot of setup

  • A quick way to compare my code and yours

  • And more!

Introduction

1
Introduction
2
Setup 1 - VS Code
3
Setup 2 - Course Files Setup
4
Setup 3 - Window Size Tool
5
Setup 4 - File Comparisions

Bootstrap Playground - Part 1 - Grid & Flexbox

1
Intro to Bootstrap Playground
2
Bootstrap Playground Custom Classes
3
Containers
4
The Grid - Part 1
5
The Grid - Part 2
6
The Grid - Part 3
7
The Grid Breakpoints - Part 1
8
The Grid Breakpoints - Part 2
9
The Grid Breakpoints - Part 3
10
Display Properties - Part 1
11
Display Properties - Part 2
12
Flex - Part 1
13
Flex - Part 2
14
Flex - Part 3
15
Flex - Part 4
16
Flex - Part 5
17
Flex - Part 6
18
Flex - Part 7
19
Flex - Part 8

Bootstrap Playground - Part 2 - Utilities

1
Typography
2
Text Utilities
3
Code
4
Bootstrap Colors
5
Spacing - Part 1
6
Spacing - Part 2
7
Spacing - Part 3
8
Sizing
9
Images
10
Figures
11
Tables
12
Borders
13
Vertical Align
14
Floats
15
Clearfix
16
Screenreaders

Bootstrap Playground - Part 3 - Components

1
Media Objects
2
Alerts
3
Badges
4
Breadcrumbs
5
Buttons - Part 1
6
Buttons - Part 2
7
Button Group
8
Dropdowns - Part 1
9
Dropdowns - Part 2
10
Dropdowns - Part 3
11
Cards - Part 1
12
Cards - Part 2
13
Cards - Part 3
14
Cards - Part 4
15
Forms - Part 1
16
Forms - Part 2
17
Forms - Part 3
18
Input Groups
19
Navs
20
Navbar - Part 1
21
Navbar - Part 2
22
Position
23
Pagination
24
Progress Bars

Bootstrap Playground - Part 4 - JavaScript

1
Carousels
2
Collapse
3
Tooltips
4
Popovers
5
Modals
6
Scrollspy
7
Bootstrap Playground Wrap Up

Project 1

1
Overview of Project 1
2
Step 1
3
Step 2
4
Step 3
5
Step 4
6
Step 5
7
Step 6
8
Step 7
9
Step 8

Project 2

1
Overview of Project 2
2
Project 2 - Step 1
3
Project 2 - Step 2
4
Project 2 - Step 3 - Part 1
5
Project 2 - Step 3 - Part 2
6
Project 2 - Step 4
7
Project 2 - Step 5
8
Project 2 - Step 6
9
Project 2 - Step 7

Project 3

1
Project 3 - Bullseye Overview
2
Project 3 - Template - Step 1
3
Project 3 - Template - Step 2
You can view and review the lecture materials indefinitely, like an on-demand channel.
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don't have an internet connection, some instructors also let their students download course lectures. That's up to the instructor though, so make sure you get on their good side!
4.8
4.8 out of 5
96 Ratings

Detailed Rating

Stars 5
55
Stars 4
32
Stars 3
5
Stars 2
1
Stars 1
3
c1191f7122d5912857f1f41f79d3614d
Get on Udemy
30-Day Money-Back Guarantee

Includes

12 hours on-demand video
Full lifetime access
Access on mobile and TV
Certificate of Completion