The Bootstrap 4 Bootcamp

The Bootstrap 4 Bootcamp

English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 11.5 Hours | 9.25 GB

Learn to build beautiful responsive websites with the latest Bootstrap version (4.1.3), Flexbox, HTML5, and CSS3!

Bootstrap is currently the single most used library on all of Github, beating out other tools like React and Angular! It’s immensely popular, and with good reason: it makes creating responsive websites a breeze.

This course will take you from a complete beginner to a Bootstrap 4 expert in a matter of hours! Or, if you already know Bootstrap 3, this course will serve a complete guide to all the new changes and improvements in Bootstrap 4. By the time we’re done, you’ll master every single component, the powerful grid system, and the brand-new utility classes. By then end of the course we’ll be building complete, responsive websites that looks great on all devices. We’ll learn to write and compile SASS to customize our own version of Bootstrap. In addition, since Bootstrap 4 is now built on top of Flexbox, we spend a lot of time learning the ins and outs of Flexbox along the way!

What makes this course special

Most Bootstrap courses follow a similar pattern: “Watch me code. Watch me do x. Watch me do y”. There’s never a chance for you to actually practice what you’re watching. This course is different. Every section contains at least one exercise, activity, or quiz to get you practicing ASAP. Sometimes I show you mockups and you to re-create the layout on your own. Other times, I give you deliberately broken code and ask you to fix it. All the activities are based on my experience teaching bootstrap in classroom and are designed to keep you engaged and learning

I’ve put a ton of work into making this course the best Bootstrap course out there. Watch a preview video or sign up and see why Bootstrap is currently the most popular front-end library around. It makes developing good-looking websites incredibly easy (and kind of fun!).

What you’ll learn

  • Learn to create beautiful, responsive websites quickly and painlessly
  • Use the latest in HTML5, CSS3, and Flexbox alongside Bootstrap 4
  • Master every single Bootstrap component
  • Use the Bootstrap 4 Grid system to create complex, fluid layouts
  • Compile your own SASS to customize Bootstrap
  • Dig into the crazy Bootstrap source files
  • Learn the ins and outs of the new Bootstrap 4 utility classes
Table of Contents

Introduction
1 Course Welcome and Introduction
2 Intro To Bootstrap
3 Do Bootstrap Sites All Look The Same !

Environment Setup
4 Comparing Bootstrap 3 and 4
5 Intro to My Editor- VSCode
6 Using Emmet
7 The Live Server Extension
8 Optional- My Theme and Colors

Getting Started With Bootstrap 4
9 GET THE CODE FOR THIS COURSE!
10 Including Bootstrap 4
11 Your First Exercise- Intro
12 Your First Exercise- Solution
13 The Bootstrap 4 Documentation

Bootstrap 4 Basics
14 Colors
15 Buttons
16 Typography
17 Jumbotrons
18 Exercise Intro
19 Exercise Solution

Super Useful Utilities
20 Bootstrap 4 Breakpoints
21 The Display Utility
22 Borders and Shadows
23 Margin and Padding
24 Exercise Intro
25 Exercise Solution

Forms
26 Form Controls
27 CheckboxesForm Checks
28 Custom Inputs
29 Input Groups and Icons
30 Inline Forms
31 Exercise Intro
32 Exercise Solution

Navbars and Flexbox!
33 The Nav Component
34 Flexbox and Navs
35 OPTIONAL Flexbox Review
36 Navbars
37 More About Navbars
38 Even More About Navbars
39 Exercise Intro
40 Exercise Solution

The Magical Grid System
41 Intro To The Grid
42 The Responsive Grid
43 Grid Alignment
44 Offsets and Nesting
45 Forms And The Grid
46 Exercise Intro
47 Exercise Solution

Cards and List Groups
48 List Groups
49 Cards Basics
50 Cards With Images
51 Cards Layout

Other Components
52 Badges
53 Breadcrumbs
54 Button Groups
55 Pagination
56 Progress Bars

JavaScript Components
57 Alerts
58 Tooltips
59 Popovers
60 Dropdowns
61 Collapse and Accordions
62 Modals
63 Scrollspy
64 Carousels
65 Exercise Intro
66 Exercise Solution

Customizing Bootstrap w SASS
67 Intro to SASS and Koala
68 Meet the Bootstrap Source Files
69 Customizing Colors

Building Aurora Grove
70 Intro to Aurora Grove
71 SASS Setup
72 Adding the Navbar
73 Building the Showcase
74 Adding an Overlay
75 The Icons and About Section
76 ExploreExperience
77 Adding in Quotes
78 Image Carousel
79 Social Media Gallery
80 Footer and Contact Form
81 The Booking Modal

BONUS PROJECT Museum of Candy
82 Museum of Candy Part 1
83 Museum of Candy Part 2
84 Museum of Candy Part 3
85 Museum of Candy Part 4
86 Museum of Candy Part 5