Learn Bootstrap By Building Projects - Includes Bootstrap 4
3.9 (1,746 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.
16,537 students enrolled

Learn Bootstrap By Building Projects - Includes Bootstrap 4

Master Responsive Web Development Using Bootstrap 3 and Bootstrap 4 While Building Real Life projects
3.9 (1,746 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.
16,537 students enrolled
Last updated 10/2019
English
English [Auto]
Current price: $23.99 Original price: $34.99 Discount: 31% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 31 hours on-demand video
  • 2 articles
  • 80 downloadable resources
  • 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
  • Build Responsive Websites
  • Understand the use of Bootstrap Components
  • Master the best practices for HTML, CSS and JS development
Course content
Expand all 231 lectures 30:46:37
+ Introduction Section
7 lectures 38:45
Who is this Course for
05:42
How to Succeed
03:28
Advantages and Disadvantages
03:42
What this Course will Cover
05:31
Html Review
10:31
Css Review
06:22
+ Bootstrap 101
3 lectures 26:43
Framework vs Library
05:15
Reading Documentations
13:13
Getting Started
08:15
Quiz 1
5 questions
+ SCSS + Gulp
15 lectures 01:32:48
Sass-Intorduction
10:50
Gulp-Intorduction
03:39
Installing-Sass-Windows
04:12
Installing-nodejs-and-npm
04:22
Starting out with gulp and sass
05:54
Testing with Browsersync
05:42
Sass Porject Structure
05:07
Variables and Nesting
11:53
BEM
10:48
Extends Mixins and Includes
08:07
Functions and Operators
07:23
LAB1 Problem
01:46
LAB1 Solution
03:18
LAB2 Problem
01:27
LAB2 Solution
08:20
Quiz 2
10 questions
+ Grid and Flexbox
11 lectures 59:27
Flexbox
03:16
Installing with NPM
10:13
Adding Custom Bootstrap to Project
06:32
Container and Breakpoints
05:56
Grid Options
07:55
Equally width Columns
06:58
Gutters and Alignment
05:15
What to stay away from in Bootstrap Grid
03:51
Nesting and Sass
04:54
Lab Problem
00:46
Lab Solution
03:51
Quiz 3
10 questions
+ Typography
4 lectures 22:03
Typography
05:11
RFS
04:07
RFS in Action
05:45
Vertical Rhythm Updated
07:00
Quiz 4
4 questions
+ Code Images and Figures
8 lectures 35:13
Code
04:23
Table Syntax
04:31
Bootstrap Tables
05:00
Bootstrap Responsive Tables
03:11
None Bootstrap Responsive Tables
06:22
Lab Problem
01:19
Lab Solution
03:55
Quiz 5
4 questions
+ Components I Alerts, Badges, Breadcrumbs and Toasts
11 lectures 01:05:17
Node Modules
09:57
Building JavaScript
09:25
Util.js
02:36
Alerts
04:25
Bootstrap Colors
08:02
Close Alerts
04:25
.JavaScript Alerts
05:22
Badges
05:19
Breadcrumb
05:35
Lab Problem
02:50
Lab Solution
07:21
Quiz 6
5 questions
+ Components 2 Buttons, Button Groups and Pagination
5 lectures 31:36
Buttons
04:14
Overriding Bootstrap
06:17
Button State
07:14
Button Group
10:30
Pagination
03:21
Quiz 7
5 questions
+ Components 3 Cards
5 lectures 31:21
Card
11:44
Media object
05:37
List Group
08:24
Lab Problem
03:06
Lab Solution
02:30
Quiz 8
6 questions
+ Components 4 Carousel, Collapse and Dropdown
8 lectures 51:51
Carousel
06:26
Carousel JavaScript
10:51
Collapse
08:08
Dropdown
07:03
Dropdown JavaScript
07:32
Jumbotron
05:31
Lab Problem
01:49
Lab Solution
04:31
Quiz 9
5 questions
Requirements
  • Students should have fair understanding of HTML, CSS and JS for this course.
Description

Bootstrap is the world's most popular mobile ready web development framework for HTML, CSS and JavaScript. Bootstrap is for you if you want to quickly build a super cool website which work across devices and browsers. It is easy to learn and super powerful. We have recently included new projects from Bootstrap 4 beta in addition to Bootstrap 3 which is the stable version of Bootstrap.

We have bought together all the best practices of building bootstrap sites into an unique project based course which will teach you all the nuances of web development while building real world bootstrap projects. The projects cover generic development process and are diverse enough to cover a very wide variety of websites. The projects covered in the course are

Bootstrap 3 Projects

Photo App Sales Website : A simple project to get you started. It will help you quickly master the basic bootstrap structures and you will be quickly up and running on your first bootstrap website.

Portfolio Resume using SASS - Learn to use SASS along with Bootstrap for this next project. Learn about Grid Systems, List Styling and Progress Bar Components in this course.

Social Network Template - This will be a fairly complex project with multiple bootstrap components. You will learn about Nested grids, Button Groups, Gallery plugin and Responsive Media Queries.

Agency Landing page - This project develops a landing page using LESS. LESS is a CSS preprocessor. You will also learn Jumbotron showcase,Scroll Down Effect and Font Awesome Icons.

Photo Gallery - You will learn to create a Photo gallery display using components such as Grid UI and Tab Widget. You will also learn the use of Bootstrap Image Carousel and Photo Lightbox Jquery Plugin.

CMS Admin Template - Learn to build an Admin template for a content management system. You will learn the use of Bootstrap Table Classes,Glyphicons, Breadcrums and Button Groups

Web hosting Company Website - This project will teach you Bootstrap Components such as Bootswatch UI tools, Content carousel, Stack icons and stylish fonts.

E-commerce Template - Learn to build a front end of an E-commerce website. Learn components such as Tab Widget, Product Grid and Custom header.

Business Bootstrap Theme - Learn to use animation in your website with animate css. Also learn to optimize your site for mobile with this amazing project.

Blog Website - Learn to build the front end of the blog with components such as Dropdown menu, Contact form, Carousel Thumbnails & Grid View.

Bootstrap 4

Whats New in Bootstrap 4 - Get to know everything thats new in Bootstrap

Hello World Project - Build a complete project template

Complete Website Project - A complete website built using latest Bootstrap 4 features

More Bootstrap 4 projects will be added soon.

With all this projects under your back you can build almost anything with Bootstrap. So click that Enroll button and see you on the other side.

Who this course is for:
  • Students who want to build responsive websites using bootstrap and have basic knowledge of HTML and CSS should find this course extremely helpful