by Vedran Cindric | Publisher: Packt Publishing | Release Date: August 2018 | ISBN: 9781788396134

Explore the full potential of Bootstrap to build highly customized, responsive, and mobile-first applications on the webAbout This VideoGet familiar with how the web is heading and how you can stay on top of the mobile trendExplore the latest features in Bootstrap, migrate to Bootstrap 4 and modify the capabilities of Bootstrap 4 to create an enhanced user experienceIntegrate Bootstrap with jQuery plugins to make your app more responsiveIn DetailBootstrap, one of the most complete frameworks, is perfectly built to design elegant, powerful, and responsive interfaces for professional-level web pages. It supports responsive design by dynamically adjusting your web page layout.This video course will begin by showing you how to modify Bootstrap 4 with the help of plugins to build highly customized and powerful UIs. On your way, you will discover several techniques that can be applied to your own web projects to build sleek, beautiful UIs and customize them. You will implement the Bootstrap mobile-first grid system, use the classes Bootstrap has in place to add responsiveness and aesthetic touches to image elements and apply handy helper classes like contextual text and background colors, floating and centering elements and clearing floated elements. Finally, you will learn how to show or hide a page element on the basis of browser screen size using Bootstrap's responsive utility classes.By the end of this video, you will explore the fullest potential of Bootstrap by building highly customized, responsive and mobile-first applications. You will also modify, and integrate bootstrap with jQuery plugins to achieve optimal results for your web projects.All the code and supporting files for this course are available on Github at https://github.com/PacktPublishing/Building-Web-UIs-with-Bootstrap-4-V

1. Chapter 1 : Bootstrap 4 – A Rocket Start
   • The Course Overview 00:03:33
   • Exploring the Latest Features of Bootstrap 00:03:34
   • Migrating to Bootstrap 4 00:04:02
   • Including Bootstrap in a Web Project 00:06:38
   • Customizing Your Framework 00:03:31
   • Digging into the Themes 00:03:57
2. Chapter 2 : Styling Your App
   • Implementing the Bootstrap Mobile-First Grid System 00:11:05
   • Incorporating HTML Image Elements 00:07:32
   • Applying Bootstrap Helper Classes 00:09:04
   • Making Your App Responsive 00:07:13
   • Using Responsive Utilities 00:07:01
3. Chapter 3 : Creating Menus and Navigation
   • Navigation Patterns and Best Practices 00:08:28
   • Working with Dynamic Tabs and Pills 00:09:39
   • Adding a Navigation Bar 00:09:52
   • Adding a Responsive Sidebar 00:06:49
   • Working with Navigation Bars and Menu Buttons 00:05:15
4. Chapter 4 : Creating a Compelling Bootstrap 4 UI
   • Creating Forms and Inputs 00:11:53
   • Using Bootstrap Toggle 00:07:42
   • How to Extend Your Select Elements with Bootstrap Select 00:06:11
   • Adding Input Sliders with Bootstrap-Slider 00:04:26
   • Employing the Flexbox Grid to Create Equal-Height Columns 00:06:37
   • Creating File Inputs with fileinput.js 00:10:02
   • Adding Dates and Times to Your Inputs with Bootstrap-Datetimepicker 00:06:30
   • Choose Date Ranges with Date Range Picker 00:08:49
5. Chapter 5 : Advanced Bootstrap Components
   • Creating Masonry Layouts with Bootstrap 00:06:22
   • Adding an Off-Canvas Menu 00:04:39
   • Using Bootstrap Scrollspy to Add Scroll Tracking 00:05:32
   • Creating Sliders with Bootstrap Carousel 00:08:31
   • Native Form Validation with Bootstrap 00:07:17
6. Chapter 6 : Advanced Bootstrap Components
   • Browser Detection 00:08:40
   • Display Images Using Bootstrap Lightbox 00:04:34
   • Improving Our Tables with DataTables 00:07:54
   • Programmatically Toggling Modals 00:06:30
   • Using Typeahead 00:10:47
   • Popovers 00:09:39