Bootstrap 4 From Scratch With 5 Projects

Master Bootstrap 4 and build 5 real world themes while learning HTML5 semantics & CSS3
Bootstrap 4 From Scratch With 5 Projects
File Size :
6.88 GB
Total length :
11h 21m

Category

Instructor

Brad Traversy

Language

Last update

6/2018

Ratings

4.7/5

Bootstrap 4 From Scratch With 5 Projects

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

Bootstrap 4 From Scratch With 5 Projects

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.
LoopLap – A social UI ThemeMizuxe – A Book/Product Showcase Theme (Sass Project)Blogen – A blog admin area UIGlozzom – A multi page theme with a carousel and some 3rd party scriptsPortfoligrid – A portfolio theme using the grid, flexbox and the collapse widget

Overview

Section 1: Intro & Getting Started

Lecture 1 Welcome To The Course

Lecture 2 What Is Bootstrap & Why Use It?

Lecture 3 What’s New In Bootstrap 4?

Lecture 4 Initial Environment Setup

Lecture 5 Bootstrap Sandbox Setup

Section 2: Typography & Utilities

Lecture 6 Section Introduction

Lecture 7 Headings & Basic Typography

Lecture 8 Text Alignment & Display

Lecture 9 Floats & Fixed Positions

Lecture 10 Colors & Background

Lecture 11 Margin & Padding Spacing

Lecture 12 Sizing & Borders

Lecture 13 CSS Breakpoints

Section 3: CSS Components

Lecture 14 Section Intro

Lecture 15 Buttons & Button Groups

Lecture 16 Navbar & Navs

Lecture 17 List Groups & Badges

Lecture 18 Forms & Input

Lecture 19 Input Groups

Lecture 20 Alerts & Progress Bars

Lecture 21 Tables & Pagination

Lecture 22 Working With Cards

Lecture 23 Media Objects

Lecture 24 Jumbotron

Section 4: Grid System & Flexbox

Lecture 25 Section Introduction

Lecture 26 Grid System

Lecture 27 Grid Alignment

Lecture 28 Flexbox Classes

Lecture 29 Auto Margin, Wrap & Ordering

Section 5: JavaScript Widgets

Lecture 30 Section Introduction

Lecture 31 Carousel Slider

Lecture 32 Collapse & Accordion

Lecture 33 Tooltips

Lecture 34 Popovers

Lecture 35 Modals

Lecture 36 ScrollSpy & Smooth Scolling

Section 6: Simple Theme Boiler Plate Setup

Lecture 37 Creating The Boiler

Section 7: Project 1 – LoopLab Social Theme

Lecture 38 Project Intro

Lecture 39 Setup & Navbar

Lecture 40 Home Section Area

Lecture 41 Explore Section Area

Lecture 42 Create & Share Section Areas

Lecture 43 Footer, Contact Modal & Menu Smooth Scroll

Section 8: Project 2 – Mizuxe Book Theme

Lecture 44 Project Intro

Lecture 45 Setting Up Sass With Koala

Lecture 46 Custom Navbar & Logo

Lecture 47 Showcase & Primary Color Change

Lecture 48 Newsletter & Boxes

Lecture 49 About Section With Accordion

Lecture 50 Authors Area

Lecture 51 Contact & Footer

Section 9: Project 3 – Glozzom Multi Page Theme

Lecture 52 Project Intro

Lecture 53 Showcase With Carousel

Lecture 54 Home Icons, Heading & Info Sections

Lecture 55 Video Section With Autoplay Modal

Lecture 56 Photo Gallery & Newsletter

Lecture 57 Page Header & About Section

Lecture 58 Icon Boxes & Testimonial Slider

Lecture 59 Services Page With FAQ Accordion

Lecture 60 Blog Page With Cards

Lecture 61 Contact & Staff Sections

Section 10: Project 4 – Blogen Admin UI

Lecture 62 Project Intro

Lecture 63 Navbar & Main Header

Lecture 64 Add Buttons & Modals

Lecture 65 Finishing The Dashboard

Lecture 66 Resource Table Pages

Lecture 67 Details & Settings Pages

Lecture 68 Profile & Login Page

Section 11: Project 5 – Portfoligrid

Lecture 69 Project Intro

Lecture 70 Main Header

Lecture 71 Home Collapse Content

Lecture 72 Resume Collapse Content

Lecture 73 Work Collapse Content

Lecture 74 Contact Collapse Content

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

Course Information:

Udemy | English | 11h 21m | 6.88 GB
Created by: Brad Traversy

You Can See More Courses in the Developer >> Greetings from CourseDown.com

New Courses

Scroll to Top