Learn Bootstrap Development By Building 10 Projects
4.1 (1,467 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
15,307 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Learn Bootstrap Development By Building 10 Projects to your Wishlist.

Add to Wishlist

Learn Bootstrap Development By Building 10 Projects

Master Responsive Web Development Using Bootstrap While Building Real Life projects
4.1 (1,467 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
15,307 students enrolled
Last updated 8/2017
Current price: $10 Original price: $60 Discount: 83% off
5 hours left at this price!
30-Day Money-Back Guarantee
  • 13.5 hours on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Build Responsive Websites
  • Understand the use of Bootstrap Components
  • Master the best practices for HTML, CSS and JS development
View Curriculum
  • Students should have fair understanding of HTML, CSS and JS for this course.

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 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

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.

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 is the target audience?
  • Students who want to build responsive websites using bootstrap and have basic knowledge of HTML and CSS should find this course extremely helpful
Students Who Viewed This Course Also Viewed
Curriculum For This Course
74 Lectures
Getting Started With Bootstrap
3 Lectures 19:53

Introduction to the Course

Preview 05:24

Introduction to Twitter Bootstrap

Preview 07:18

Learn to build a starter template for your projects

Creating a Starter Template
Photo App Sales Website
7 Lectures 01:20:29

Introduction to the first project - The Photo App Sales Website

Preview 02:18

Learn to use the Navbar and Jumbotron

Preview 10:00

Learn to use the Grid system in bootstrap

Preview 12:37

Add columns, icons and footer to your website

Preview 09:57

Learn to use the columns

Columns usage

Add Inner Pages, Accordion and Forms to your website

Inner Pages, Accordion & Form

Learn to optimize your site for Mobile devices

Mobile Optimization
Portfolio Resume Using SASS
5 Lectures 56:47

Introduction to the project

Project Intro

Learn to set up SASS for the project

Sass Environment Setup

Adding the HTML markup to the project

Bootstrap HTML Markup

Finishing up the markup

Adding Bootstrap HTML Markup - Final Changes

Adding the SCSS styles to the project

SCSS Styles
Social Network Template
9 Lectures 01:43:54

Introduction to the Project

Project Intro

Building the main page for the website

Main Page

Adding final changes to main page

Main Page - Adding Button Group

Add more features to the main page

Main Page - Adding More Wall Features

Add the final changes to the main page

Main Page - Fine tuning the main page

Add the pages for members, groups and profiles

Members, Groups & Profile Pages

Building features such as members, groups and profile pages

Members, Groups & Profile Pages - Final Changes

Learn to add photos with tool tip

Photos With ToolTip & Modal

Final changes to the project
Agency Landing Page Using LESS
8 Lectures 01:20:45

Introduction to the project

Project Intro

Learn to set up the LESS environment

Setup Less Environment

Add the HTML to your website

Digital Agency HTML Markup

Add the final changes to the HTML page

Digital Agency HTML Markup - Final changes

Implement the Navbar in your project

Navbar & Intro CSS

Adding the final changes to the navbar

Final Navbar Changes

Build the CSS for the page section

Page Section CSS

Add the final scrolling and navbar effect

Scrolling & Navbar Effect
Photo Gallery
5 Lectures 40:15

Introduction to the project

Project Intro

Learn to create the Image Grid for the App

Image Grid

Add category tabs to your project.

Category Tabs

Integrate the Image Carousel to your project

Image Carousel

Learn to integrate the Lightbox in your website

Image Lightbox
CMS Admin Template
8 Lectures 01:32:57

Introduction to the project

Project Intro

Add the login page and bootswatch navbar

Login Page & BootSwatch Navbar

Build the resource tables in your website

Resource Tables

Add final changes to the resource table

Resource Tables - Final Changes

Implement breadcrumbs, pagination and button groups to your website

Breadcrumbs, Pagination & Button Groups

Implement the table sorter

Table Sorter

Learn to implement a search filter

Search Filter

Adding Form Pages
Web Hosting Company Website
7 Lectures 01:15:43

Introduction to the project

Project Intro

Add the theme and navigation bar to the website

Theme & Navbar

Implement the carousel slider

Carousel Slider

Add Icons and price tables

Icon Blocks & Price Tables

Finish up the icon blocks for the website

Icon Blocks & Price Tables - Final Changes

Add the contact pages to the website

Domains & Contact Pages

learn to add the Login Modal dialogue box to the website

Login Modal
Ecommerce Template
7 Lectures 01:27:04
Project Intro

Implement the LESS and add the Navbar

LESS Setup & Navbar

This lecture describes the implementation of Header and product grid.

Header & Product Grid

Finishing up the final view of header and product grid

Header & Product Grid - Creating the Final View

Implement the Tab showcase

Tab Showcase

Tab Showcase - Final Changes

Add the product details page

Product Details Page
Business Bootstrap Theme
8 Lectures 01:41:27
Project Intro

Learn to create the vendor setup

Folder & Vendor Setup

Learn to build the animated showcase for the website

Navbar & Animated Showcase

Homepage sections

Homepage Sections

Finishing up the homepage

Homepage Sections - Final touches

This lecture creates the inner pages for the website

Inner Pages

Finish up the remaining inner pages

Inner Pages - Final changes

Learn to optimize the website for mobiles

Mobile Optimization & Animation
2 More Sections
About the Instructor
Eduonix Learning Solutions
4.2 Average rating
50,079 Reviews
805,094 Students
190 Courses
1+ Million Students Worldwide | 200+ Courses

Eduonix creates and distributes high quality technology training content. Our team of industry professionals have been training manpower for more than a decade. We aim to teach technology the way it is used in industry and professional world. We have professional team of trainers for technologies ranging from Mobility, Web to Enterprise and Database and Server Administration.

Eduonix-Tech .
4.2 Average rating
48,033 Reviews
782,533 Students
145 Courses