Video description
Master the latest version of Bootstrap (4.0.0 Beta) and build 5 real-world themes while learning HTML5 semantics & CSS3
About This Video
- Very easy to follow.
- This course was created for the beta version of Bootstrap but its applicable for the latest version.
In Detail
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 custom workflow and start the projects. Everything is completely modular! The author has 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.Bootstrap Starter Pack - Once you get through the sandbox, we will setup the starter pack which I also created for this course. This will give us a real development workflow to compile Bootstrap 4 from source and compile Sass. It will even give us a dev server with autoload. This is what we will use for the 5 projects. We will use the Starter pack to create 5 real-world themes including:
LoopLap - A social UI Theme
Mizuxe - A Book/Product Showcase Theme
Blogen - A blog admin area UI
Glozzom - A multi-page theme with a carousel and some 3rd party scripts
Portfoligrid - A portfolio theme using the grid, flexbox and the collapse widget
Table of Contents
Chapter 1 : Intro Getting Started
Welcome To the Course
What Is Bootstrap Why Use It?
What’s New In Bootstrap 4?
Initial Environment Setup
Bootstrap Sandbox Setup
Chapter 2 : Typography Utilities
Section Introduction
Headings Basic Typography
Text Alignment Display
Floats Fixed Positions
Colors Background
Margin Padding Spacing
Sizing Borders
CSS Breakpoints
Chapter 3 : CSS Components
Section Intro
Buttons Button Groups
Navbar Navs
List Groups Badges
Forms Input
Input Groups
Alerts Progress Bars
Tables Pagination
Working with Cards
Media Objects
Jumbotron
Chapter 4 : Grid System Flexbox
Section Introduction
Grid System
Grid Alignment
Flexbox Classes
Auto Margin, Wrap Ordering
Chapter 5 : JavaScript Widgets
Section Introduction
Carousel Slider
Collapse Accordion
Tooltips
Popovers
Modals
ScrollSpy Smooth Scolling
Chapter 6 : Simple Theme Boiler Plate Setup
Creating the Boiler
Chapter 7 : Project 1 - LoopLab Social Theme
Project Intro
Setup Navbar
Home Section Area
Explore Section Area
Create Share Section Areas
Footer, Contact Modal Responsiveness
Chapter 8 : Project 2 - Mizuxe Book Theme
Project Intro
Setting Up Sass with Koala
Custom Navbar Logo
Showcase Primary Color Change
Newsletter Boxes
About Section with Accordion
Authors Area
Contact Footer
Chapter 9 : Project 3 - Glozzom Multi Page Them
Project Intro
Showcase with Carousel
Home Icons, Heading Info Sections
Video Section with Autoplay Modal
Photo Gallery Newsletter
Page Header About Section
Icon Boxes Testimonial Slider
Services Page with FAQ Accordion
Blog Page with Cards
Contact Staff Sections
Chapter 10 : Project 4 - Glozzom Multi Page Theme
Project Intro
Navbar Main Header
Add Buttons Modals
Finishing the Dashboard
Resource Table Pages
Details Settings Pages
Profile Login Page
Chapter 11 : Project 5 – Portfoligrid
Project Intro
Main Header
Home Collapse Content
Resume Collapse Content
Work Collapse Content
Contact Collapse Content