The Complete Bootstrap Masterclass Course - Build 4 Projects
4.0 (774 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.
49,035 students enrolled

The Complete Bootstrap Masterclass Course - Build 4 Projects

In this complete course students will learn how to build 4 projects using bootstrap and other website development tools
4.0 (774 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.
49,035 students enrolled
Last updated 8/2016
English
English [Auto]
Current price: $119.99 Original price: $199.99 Discount: 40% off
1 day left at this price!
30-Day Money-Back Guarantee
This course includes
  • 7 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
  • Completely Understand What is Bootstrap and How to Work on Bootstrap
  • You'll be able to Customize Bootstrap.
  • You'll be able to Create Profesional Websites using Bootstrap
Course content
Expand all 67 lectures 06:58:00
+ Bootstrap Tools and Elements
39 lectures 03:45:15

Welcome to the complete bootstrap masterclass course! Here you will learn all of the benefits to taking this course and what you are going to learn! We are here to help so feel free to message us anytime!

Preview 03:23

Bootstrap Download and Installation!

Download and Install Bootstrap and jQuery
04:35
Bootstrap Theory: Is Bootstrap For All Devices?
03:50

Shahzaib, can we REN this lecture again please? Same background humming.

In this Lecture, We'll Discuss how Bootstrap actually works on our website. and what arr the Bootstrap Classes.

How Bootstrap Works
02:10
There are two type of Container Bootstrap has. We'll discuss both of them
Bootstrap Container
02:22

This is the most important Lecture in Bootstrap. You'll be learning about the Bootstrap Grid System. Generally Bootstrap support 12 columns.

Bootstrap Grid System
06:17

Bootstrap has many Text Styles We'll learn all of them.

Text Styles
07:01

Some More Bootstrap Text style which are necessary to learn.

More on Text Styles
10:11

For Creating Perfect Tables, Bootstrap has some Table specified classes.

Bootstrap Tables
07:28

Bootstrap support 3 classes of images to convert the image into circle, thumbnail or responsive.

Bootstrap Images
02:20

Bootstrap is workable on Buttons as well. It has many button styles which can make our buttons beautiful.

Bootstrap Buttons
03:56

By using the Bootstrap, We can make Button Groups too.

Bootstrap Button Group
03:39

Creating the Drop Down menu is so easy now, because of the bootstrap, we don't need to create any jQuery or Bootstrap for this.

Bootstrap Drop Down Button
06:40

Glyphicons are the important and interesting part of Bootstrap. Basically its a font which has many icons. We have to buy the Glyphicons but now, if you download the Bootstrap, you can get the Glyphicon for free.

Bootstrap Glyphicon
06:06

Let's make a Perfect header by using the Jumbotron or the Page Header.

Page-header and Jumbotron
03:02

The Bootstrap is Just like the Jumbotron but Well are Paragraph Specified. and the writing won't be too big if you put inside the Well.

Bootstrap Wells
01:49

Bootstrap Alerts can be very helpful if you're using a programming language and want to show the result of execution of any command.

Bootstrap Alerts
04:48

Labels and Badges are very Amazing Elements to add label with specific designing. We can Apply the Badge or Label according to the need.

Labels and Badges
04:18

Bootstrap Panels can be very helpful if you want to create a panel or the area where you can put any of your data with an specific heading and footer.

Panels
04:16

Before the Bootstrap we have to Use the jQuery or JavaScript to create the Collapsible Element. But with the Bootstrap, we just need to put some classes and attributes.

Collapsibles
05:30

We can Apply the Collapsibles on Panels too.

Collapsible on Panels
03:07

By Using List Groups, we can create A Beautiful group of list with some bootstrap CSS effects.

List-Group
08:01

We can apply the Collapsible to the list groups too and we can make Accordion as well.

Collapsible List Group and Accordion
12:19

For Creating Tabs, We don't need to use jQuery Anymore. We can use Bootstrap classes to make Tabs.

Tabs
05:50

Pills are Just Like Tabs and we can apply the Pills on Bootstrap Using the Same Techniques.

Pills
05:17

We'll add the Dynamic features to the Tabs and Pills in this Lectures

Dynamic Pills and Tabs
04:57

For Going to the Next or Previous Page, or sorting Page like in Numbers, we use pagers and Paginations.

Pager and Pagination
05:07

In this Lecture, we'll create a Complete Navigation bar by using Bootstrap.

Navbar Complete
09:10

We can Apply the Bootstrap to the Form Elements as well.

Bootstrap Form
09:39

In this Lecture, we'll learn to make a Horizontal Form.

Horizontal Form
10:50

Some more Bootstrap Feature on the HTML Form.

More on Form
03:35

We can apply the specific Bootstrap Styles upon the Form Validations.

Form Validation Styles
05:33

Bootstrap Modal is Popup Box. But it's very Beautiful with specific header, body and footer.

Modals
06:47

For Creating the Carousel Slider, We only need to Apply some Bootstrap Classes. No need to download, Install the Plugin and Creating jQuery Script Anymore.

Carousel
10:04

Here, we'll learn to add caption to every Carousel Slide.

Carousel With Caption
03:10

ScrollSpy is an Interesting Plugin which is built-in in the Bootstrap.js. When we scroll the screen down or up it changes the navigation element's active status according to the opened element.

ScrollSpy
09:49

By Using Tooltip, we can create the Beatiful Title. Actually we add a title attribute with some paragraphs or words in HTML which needs definitions. So when use hovers the mouse over that element, the Title shows the text which we inserted. But by using the Bootstrap ToolTip, we can design the Title as well.
But we have to use jQuery for this.

ToolTip
05:46

Popover is Just like the Tooltip but it has the heading as well with the content. It also needs jQuery script to work.

PopOver
05:11
Quiz 1
2 questions
+ PortFolio Project
4 lectures 29:47

Creating Navigation and Home Area for the Portfolio Project.

Creating Navigation and Home Area
09:35

Creating the Second section for the Project which is my Work Area.

Creating My Work Area
05:43

This is the Third Section of the Portfolio website which is the ABOUT Area.

Creating About Area
08:10

This is the last Area of the the Portfolio Website where we'll create the Contact form.

Creating Contact Area
06:19
Quiz 2
1 question
+ Photo Gallery Project
7 lectures 41:30

In this Lecture, we're starting the make the Photo Gallery.

Creating Navbar
04:15

Applying Carousel Slider to the Photo Gallery.

Creating Carousel Slider
07:21

Creating Thumbnails of images for the Photo Gallery.

Creating Thumbnails
06:23

Creating Footer for the Photo Gallery Project.

Creating Footer
02:13

Applying Modals to the thumbnails to make them viewable perfectly.

Creating Modal
08:25

Downloading and Using LightBox Plugin to the photo Gallery.

Using Lightbox plugin with bootstrap
11:02

Adding Captions to the LightBox Elements in the Photo Gallery.

Adding Caption to the LightBox Elements
01:51
Quiz 3
2 questions
+ Blog Project
7 lectures 55:15

Here in this Lecture, we are starting to create the blog website.

Creating HTML Syntax
03:33

In this Lecture, we'll learn to Customize Bootstrap by Customizing Bootstrp's navbar and some other Elements.

Creating Navbar and Customizing Bootstrap
08:47

Creating Header and Search bar for the Blog Website.

Creating Header and Search Bar
12:37

In this Lecture, We're About to Creating the Post Area for the Blog.

Creating Posts Area
15:57

Creating Footer with some CSS.

Creating Footer
05:08

Creating Posts Page.

Creating Posts Page
04:24

Creating About page for learning some other Techniques.

Creating About Page
04:49
Quiz 4
1 question
+ Creating eCommerce Website
10 lectures 01:06:14
Creating Syntax and Navbar
07:24
Creating Carousel
07:57
Adding Caption to Carousel
03:40
Creating aside and Product Area
08:45
Editing Aside Area with New Style
07:17
Creating Product Page
12:49
Creating Related Search Area
02:40
Creating Modal for Form
05:10
Creating Order Form
05:15

Our special bonus lecture only for students enrolled in our course! 

Want More?! Watch Our Special Bonus Lecture & Continue Learning With Us Today!
05:17
Requirements
  • Basic HTML & CSS Knowledge
  • Notes and Note Sheets
  • A Computer with internet access
  • An open mind and willingness to learn a new skill!
Description

Welcome To The Complete Bootstrap Masterclass - Build 4 Projects

⇉ Watch the promo video to see How You Can Begin Mastering Bootstrap To Build You Next Professional Website Today!

⇉ This Course is MASSIVE! You receive over 7+ hours of video content & 60+ lectures!

⇉ Join Over 275,000+ Students Who Have Enrolled In My Udemy Courses This Year!

⇉ 7,500+ Five Star Reviews on our courses prove Students Who Enrolling Are Getting Real Results!

Then this course is for you! Click "Take This Course Now" For Instant Life-Time Access!

"Complete bootstrap course....well explained.....After searching so many courses in udemy,this course taught me complete bootstrap and it is for beginner to advanced...Thank you very much..." -Pratrap

"This was one of the best courses I've ever joined" -Tariq Alkhassa

__________________________________________________________________________

Learn the basic concepts, tools, and functions that you will need to build beautiful, fully functional, professional landing pages within the bootstrap framework. But that is not all you will learn from enrolling in our course...

You Will Learn:

  • Bootstrap components
  • Grid System
  • Customizing Bootstrap
  • Glyphicon icons
  • So Much More!

This course will help you create a perfect bootstrap responsive landing page for your app, business, portfolio or blog. Having a little knowledge of HTML & CSS is ideal to get you started on the quicker route to Bootstrap, however it isn't essential. I will walk you through every step of code to ensure you have the right understanding and tools to further your learning after you have completed the course.

You will not only create a clean, modern professional looking bootstrap landing page, you will also add scroll spy, animation and Google Webfonts to make sure your website stands our from the crowd. We start by understanding the basics of bootstrap, how it works and how it is implemented. We will cover the famous grid system and media queries to ensure your new page looks it's best on all devices.

You will learn-by-doing which will help you understand all aspects of bootstrap and give you the tools to re-design our template or build an entirely new landing page specifically how you want it. You will be able to download project files throughout the course, which will be yours to keep and work on at your leisure

__________________________________________________________________________

With the right mindset, understanding, and application of the teachings in this course, you will instantly begin to move towards Mastering Bootstrap To Build You Next Professional Websites Today!

When we learn something new, I add it to the course - at no additional cost to you! This is a course that will continue to add more and more to every aspect of your life.

In addition to the Udemy 30-day money back guarantee, you have my personal guarantee that you will love what you learn in this course.

__________________________________________________________________________

What I can't do in this Course..

I can't guarantee your success – this course does take work on your part. But You Can Do It!

I am also not responsible for your actions. You are responsible for 100% of the decisions and actions you make while using this course.

__________________________________________________________________________

This course will not remain this price forever! It's time to take action!

Click the "take this course" button at the top right now!

...every hour you delay is costing you money...

See you in the course!

Sincerely,

Joe Parys & Shahzaib Kamal

Who this course is for:
  • Anyone looking to improve their web development skill set
  • Anyone looking to learn more about web development and design
  • Who want to Make thier Career on Web Designing
  • Who want to sharpen their Skills as a Professional Web designer