Build a responsive webpage with Bootstrap 3 Premium class

Sandy Ludosky

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
30 Videos (3h 52m)
    • Curriculum & Project Overview

      demo.zip
      2:37
    • Section overview & intro

      0:44
    • Downloading Bootstrap 3

      4:31
    • The Grid System

      7:12
    • Grid Demos & Examples - part I

      9:53
    • Grid Demos & Examples - part II

      11:17
    • Section Overview

      0:48
    • Styling with CSS - Part I

      14:26
    • Styling with CSS - Part II

      13:37
    • Styling with CSS - Part III

      9:37
    • Boostrap Components - Part I

      14:35
    • Boostrap Components - Part II

      10:57
    • Boostrap Components - Part III

      9:53
    • Section Overview

      0:49
    • Collapse.js

      8:30
    • Carousel.js

      6:55
    • Tab.js

      7:17
    • Affix.js

      4:12
    • Project Overview

      0:45
    • Customize the Header

      13:32
    • Create the Products Thumbnails

      8:02
    • Create the Photo Gallery

      8:56
    • Customize the Footer

      9:44
    • Responsive Utilities and Media Queries

      11:53
    • Section Overview

      1:29
    • Create a Slideshow with Carousel.js

      12:38
    • Add a Contact Form with Modal.js

      8:52
    • Popover.js

      7:59
    • Tooltip.js

      6:11
    • Add Scrollspy.js to the navbar

      4:29

About This Class

Learn Bootstrap:  the lightweight and responsive framework for a better and faster mobile-friendly web development.

Demos and exercices: to get you up to speed with the most popular responsive framework.

This course is VERY hand-on. You will learn:

  • The Bootstrap CSS and Components
  • The responsive and flexible grids to build complexe layouts
  • to create functional and responsive pages, working accross all devices.

Final Project. This is what you will build by the end of the course:

ee1343ce

view in browser

Topics include:

  • Downloading and understanding the boostrap files
  • Review of the Bootstrap files structure
  • Presentation and demonstration of the 12-column Grid System
  • Styling easily and quickly with Bootstrap built-in CSS classes
  • Adding functional components like navbars, responsive tables, forms...
  • Adding interactive elements with javascript plugins, like the carousel, the modal...
  • A 2-part design project featuring multiple examples of the Bootstrap CSS styling and dynamic elements

Join me and other students to learn about the most popular open-source responsive framework Bootstrap3.

17 of 17 students recommendSee All

great, well organized intro to bootstrap
I loved her style of instruction, her pace is fast and great - I had to pause sometimes to catch up (would recommend dual monitors!). The use of many short videos kept me motivated
I've heard of Bootstrap a long time ago. I tried downloading it and taking a peek but I was overwhelmed immediately. I thought this class was a very well introduction to grasping the potential of Bootstrap. Though most of this course involves a lot of plug-and-play, I'd recommend anyone thinking of taking this class to have some foundation in HTML & CSS. Sandy touches on pretty much everything on the Bootstrap site—teaching through examples. I'm really looking forward to taking her next class on building a portfolio. I hope it'll contain more content on customizing looks and appearance. Can't wait to start building things! Thank you Sandy!

753

Students

--

Project

My name is Sandy. I am a freelance Web Designer and Developer based out of Toronto, in Ontario, Canada.

I specialize in Front-End using HTML, CSS, CSS3 Animation, Sass, Javascript and JQuery.

I love creating beautiful, professional and user-friendly websites using the Adobe Creative Suite: Photoshop, Illustrator and Flash to name a few.

Also, I am keen on Web marketing, Web analytics, Visual Design, Video Editing, Photography and WordPress development.

On top of being a Udemy instructor, I am an avid learner of new technologies and digital stuff.