Oreilly - Bootstrap 4 From Scratch With 5 Projects

Oreilly - Bootstrap 4 From Scratch With 5 Projects

by Brad Traversy | Publisher: Packt Publishing | Release Date: May 2018 | ISBN: 9781789535457

https://www.oreilly.com/library/view/bootstrap-4-from/9781789535457/

Master the latest version of Bootstrap (4.0.0 Beta) and build 5 real-world themes while learning HTML5 semantics & CSS3About This VideoVery easy to follow.This course was created for the beta version of Bootstrap but its applicable for the latest version.In DetailYou 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 ThemeMizuxe - A Book/Product Showcase ThemeBlogen - 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

Chapter 1 : Intro & Getting Started
- Welcome To the Course 00:04:48
- What Is Bootstrap & Why Use It? 00:07:21
- What's New In Bootstrap 4? 00:05:23
- Initial Environment Setup 00:08:58
- Bootstrap Sandbox Setup 00:05:50
Chapter 2 : Typography & Utilities
- Section Introduction 00:02:29
- Headings & Basic Typography 00:09:14
- Text Alignment & Display 00:09:24
- Floats & Fixed Positions 00:06:15
- Colors & Background 00:09:08
- Margin & Padding Spacing 00:10:28
- Sizing & Borders 00:06:53
- CSS Breakpoints 00:05:26
Chapter 3 : CSS Components
- Section Intro 00:02:19
- Buttons & Button Groups 00:14:48
- Navbar & Navs 00:21:22
- List Groups & Badges 00:08:46
- Forms & Input 00:13:13
- Input Groups 00:08:09
- Alerts & Progress Bars 00:09:39
- Tables & Pagination 00:09:48
- Working with Cards 00:21:16
- Media Objects 00:07:55
- Jumbotron 00:04:17
Chapter 4 : Grid System & Flexbox
- Section Introduction 00:02:10
- Grid System 00:16:56
- Grid Alignment 00:06:02
- Flexbox Classes 00:09:18
- Auto Margin, Wrap & Ordering 00:03:40
Chapter 5 : JavaScript Widgets
- Section Introduction 00:01:32
- Carousel Slider 00:16:11
- Collapse & Accordion 00:07:18
- Tooltips 00:08:40
- Popovers 00:06:38
- Modals 00:06:56
- ScrollSpy & Smooth Scolling 00:07:34
Chapter 6 : Simple Theme Boiler Plate Setup
- Creating the Boiler 00:06:13
Chapter 7 : Project 1 - LoopLab Social Theme
- Project Intro 00:02:43
- Setup & Navbar 00:07:19
- Home Section Area 00:18:51
- Explore Section Area 00:09:37
- Create & Share Section Areas 00:07:37
- Footer, Contact Modal & Responsiveness 00:10:25
Chapter 8 : Project 2 - Mizuxe Book Theme
- Project Intro 00:02:47
- Setting Up Sass with Koala 00:10:55
- Custom Navbar & Logo 00:09:34
- Showcase & Primary Color Change 00:06:40
- Newsletter & Boxes 00:14:20
- About Section with Accordion 00:07:13
- Authors Area 00:09:39
- Contact & Footer 00:11:27
Chapter 9 : Project 3 - Glozzom Multi Page Them
- Project Intro 00:03:20
- Showcase with Carousel 00:20:08
- Home Icons, Heading & Info Sections 00:11:31
- Video Section with Autoplay Modal 00:08:57
- Photo Gallery & Newsletter 00:13:15
- Page Header & About Section 00:10:42
- Icon Boxes & Testimonial Slider 00:10:22
- Services Page with FAQ Accordion 00:13:33
- Blog Page with Cards 00:09:54
- Contact & Staff Sections 00:12:58
Chapter 10 : Project 4 - Glozzom Multi Page Theme
- Project Intro 00:03:54
- Navbar & Main Header 00:10:20
- Add Buttons & Modals 00:15:41
- Finishing the Dashboard 00:12:06
- Resource Table Pages 00:12:16
- Details & Settings Pages 00:11:40
- Profile & Login Page 00:12:35
Chapter 11 : Project 5 – Portfoligrid
- Project Intro 00:02:13
- Main Header 00:17:21
- Home Collapse Content 00:06:08
- Resume Collapse Content 00:07:18
- Work Collapse Content 00:08:16
- Contact Collapse Content 00:05:57