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