Mastering Bootstrap 4
4.2 (8 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
50 students enrolled

Mastering Bootstrap 4

Build powerful and beautiful websites with the Bootstrap 4 framework
4.2 (8 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
50 students enrolled
Created by Packt Publishing
Last updated 8/2017
English [Auto]
Current price: $86.99 Original price: $124.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 6.5 hours on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • See how to use Bootstrap 4 to develop multi-page websites
  • Find out more about Bootstrap components and tools
  • Master styling, navigation, and alerts, and responsive queries
  • Understand how to plan and design a website
  • Become proficient in using classes
  • Explore options for rapid web development
  • Build highly customizable web interfaces
  • Bring your web pages to life using Bootstrap jQuery plugins
Course content
Expand all 56 lectures 06:20:27
+ Getting to Know Bootstrap
4 lectures 28:14

This video provides an overview of the entire course.

Preview 07:26
Source online for Bootstrap source files
Getting Bootstrap – Download - CDN
Using Bootstrap within your web applications
Adding Bootstrap to Web Projects
Find out more about using Bootstrap benefits of Bootstrap
What is Bootstrap?
+ Breakdown of Bootstrap
6 lectures 47:10
Basics of how Bootstrap works.
Preview 05:51

How to work more efficiently to build websites quickly

Creating a Bootstrap Template

Positioning of content making it respond to different size screens.

The Grid System
Focus on columns and why it's important to understand how they work.
Bootstrap Columns and Rows

How to quickly style headings and highlight visible content within your web project

Bootstrap Jumbotron
Going beyond HTML with Bootstrap typography, making typically styling easy with Bootstrap.
Bootstrap Typography
+ Tools and Components
8 lectures 58:57
Alignment of text and text options
Preview 09:45
New Bootstrap 4 component for grouping content together
Bootstrap Cards
Visual images and what can be down with bootstrap
Bootstrap Images
In this video we are going to look at the class Nav
Bootstrap Nav
How to use Bootstrap classes to make buttons
Bootstrap Buttons
more advanced options for Bootstrap buttons
Bootstrap Button Grouping

How to make your text appear and get presented within your web application.

Bootstrap Alignments and Styling
Making website design easy and quick with Bootstrap
Bootstrap Other Components
+ Going further with Bootstrap
6 lectures 41:16
In this section we are going to go have a look at Glyphicons and Font Awesome
Preview 05:52
In this video we are going to learn about Bootstrap Alerts
Bootstrap Alerts
In this lesson we are going to revisit Pagination in Bootstrap
Bootstrap Pagination
In this video we are going to look at the class Nav
Bootstrap Nav
In this video we are going to look at what we can do with Bootstrap Navbars
Bootstrap Navbars
In this video we are going to look at Responsive Media Queries
Responsive Media Queries
+ Bootstrap Useful Components
3 lectures 27:22

In this section we are going to introduce you to form elements and form classes

Preview 06:37

In this video we are going to learn about Bootstrap Forms and how we can use them

Bootstrap Forms
In this lesson we are going to look at Bootstrap Responsive Utilities
Bootstrap Responsive Utilities
+ Bootstrap Resources
3 lectures 17:19

In this section we are going to highlight some of the top resources online.

Preview 09:43
In this lesson we are going to look at Bootstrap Template resources
Bootstrap Template Resource

To help create maintainable code, the SOLID principles of software design can be used as a tool to help ensure our codebase stays in a testable and robust state.

Bootstrap Templates
+ Adding jQuery
2 lectures 15:49

What jQuery is and how to get it into web projects for dynamic capability.

Preview 05:16

Where to get jQuery and how to bring it into your projects

CDN and what can be done with jQuery
+ jQuery and Bootstrap
5 lectures 31:59

Simple jQuery functional elements

Preview 05:55

Learn how to effectively create popup messages with Bootstrap Modals

Bootstrap 4 Modal
Create image carousels with classes and attributes
Bootstrap 4 Carousel

Bringing bootstrap carousels to the next level

Bootstrap 4 Carousel options
Bootstrap and adding active classes to current screen locations.
Bootstrap 4 ScrollSpy
+ Simple Single Page Website
8 lectures 47:59

Learn about getting started to build a website with Bootstrap

Preview 03:02

Starting off to create a website

Creating Template and Container
How to get started with your web project before you have the assets
Add Placeholder Content and Sections
How to add navigation to your website
Create Navbar
Why content area planning is important and how to do it
Create the Content Area
Website review process to fine tune your site
Update and Tweak Layout
Web resources that you can use to supplement Bootstrap
Add custom Styling and Fonts
Web users are expecting more, they are looking for dynamic capabilities within website.
Create Functionality Using JQuery
+ Multi Page Website
11 lectures 01:04:22
Steps and resources for starting a web project
Preview 06:22
Starting with a template and building a website from scratch
Creating Template and Container
Design your website without assets ready
Adding placeholder Content and Sections
Using navigation bars design patterns for web users.
Creating Navbar
how to prepare for content
Creating the Content Area
Use Bootstrap to style amazing contact forms
Creating Contact Form
Create visually styled content using Bootstrap
Creating Portfolio page
Prepare your website and check it for tweaks and updates
Updating and Tweak Layout
Customize your website to look the way you want
Adding Custom Styling and Fonts
Do more with your website make it dynamic and interactive
Creating Functionality Using JQuery
What Bootstrap can do to make it easy to add cool stuff to your website
Adding in Bootstrap jQuery Components
  • This video course is for intermediate-level front-end web developers with a firm grasp on the basics of Bootstrap, as well as HTML, JavaScript, and CSS. The course dives deep into the various components of Bootstrap, and will teach you to harness its power to build engaging and beautiful websites.

Bootstrap is a free and open source front-end web framework for designing websites and web applications. This course will help you learn to use Bootstrap within your web projects for more rapid development. You’ll explore how you can use CSS classes within your HTML to bring Bootstrap functionality to your project.
You’ll start by getting to grips with using containers, grids, and Typography in Bootstrap as well as forms, buttons, navigation, and other interface components. Then, you’ll get to work with alerts, navigation components, and responsive queries. Moving forward, you’ll work with Bootstrap forms and queries, and access resources that will help you build attractive websites.
After that, you’ll find out how to use utility classes and various form options. Among other things, you will also tour the anatomy of a Bootstrap plugin, create your own custom components, and extend Bootstrap using jQuery.
By the end of this course, you will have a thorough knowledge of the framework’s ins and outs, and be able to build highly customizable and optimized web interfaces.Your websites and projects of all sizes will work across multiple screens sizes perfectly with Bootstrap.

About the Author

Laurence Svekis is a highly experienced web developer with over 18 years of web development experience. He has worked on various large and small projects, and has been an instructor for several Bootstrap projects on a number of platforms, reaching a large number of students and professionals. His web application development areas of expertise include HTML, CSS, JavaScript, JQuery, Bootstrap, PHP, and MySQL. Laurence is passionate about everything to do with web application development, programming to online marketing with a strong focus on social media and SEO.

Who this course is for:
  • This course combines in-depth content balanced with tutorials that put theory into practice. The focus is giving you both the theoretical understanding and practical experience required for you to master the art of web development with Bootstrap.