Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Rapid Website Design with Bootstrap
Rating: 4.2 out of 5(358 ratings)
44,907 students

Rapid Website Design with Bootstrap

Learn how to use Bootstrap to apply classes to HTML pages for styling. Make responsive websites from scratch quickly
Created byLaurence Svekis
Last updated 11/2024
English
English [Auto],

What you'll learn

  • create a bootstrap website
  • apply Bootstrap classes for rapid web development
  • use Bootstrap as a framework for web design and development

Course content

3 sections20 lectures1h 12m total length
  • Introduction to Bootstrap for rapid web development2:30

    Learn to design a rapid, responsive website from scratch using Bootstrap CSS classes and jQuery components, including a Google Maps API integration, a contact form, and a carousel.

  • Web Resources3:41

    Master rapid, mobile-first web design with HTML, CSS, and Bootstrap, using Brackets as editor, Chrome dev tools, CDN resources, placeholder text, dummy images, and the Google Maps API.

  • New Bootstrap 4 beta updates0:47
  • Build a default Bootstrap Template4:20

    Set up a Bootstrap template. Define doctype, html, and head with utf-8 charset, viewport, and x-ua-compatible; link Bootstrap CSS via CDN and include jQuery, Bootstrap JS, and tether for tooltips.

  • Source Code Default Bootstrap 4 template0:08
  • How to create a Bootstrap 4 Navbar10:00

    Build a Bootstrap 4 navbar with dark and light themes, a collapsible content area, and a responsive toggle button that adapts across screen sizes.

  • Complete Navbar in Bootstrap7:38

    Implement a complete responsive navigation bar in Bootstrap by using a toggle button, collapse behavior, and proper data attributes to link to the nav list, with customizable colors and breakpoints.

  • NavBar Source Code0:10
  • Containers for content4:21

    Explore how to structure a Bootstrap page using container and container-fluid, define a 12-column grid, create sections and columns, and visualize borders and colors for responsive layouts.

  • Bootstrap responsive images6:18

    Explore how Bootstrap makes images responsive with the fluid image class and breakpoints. Learn to float, round, and thumbnail images to keep text aligned and space well used.

  • Build Footer Element4:23

    Learn to build a Bootstrap footer using container or fluid layouts, add sections and a map placeholder, and center the text for a site-wide footer.

Requirements

  • Basic understanding of HTML CSS
  • Computer access

Description

Bootstrap helps you create webpages faster!

Connect the Bootstrap framework to your web projects, to access amazing classes that can easily be added to HTML pages to create styling.   Bootstrap also provides a number of commonly used components that can also be added with classes and attributes into your web pages.

This course is designed to show you how to build your own custom website from scratch using Bootstrap as a framework.  Bootstrap has you covered, it lets you take the repetitive styling work out of you web design projects and focus your time on the user experience.

This is a unique web project designed for beginners to learn more about how to make websites with Bootstrap.  This course includes a step by step approach, beginning with a blank file and showing you how to build a website.  

Source code is included so you can work alongside the lessons and create your own project.

  • HD quality video
  • Learn how to add classes
  • build a navbar menu
  • add Google maps APi
  • create content sections
  • explore the Bootstrap Grid
  • useful jQuery components

I'm here to help you learn Bootstrap and ready to answer any questions you may have. Enroll now and see what you can do with Bootstrap.


Who this course is for:

  • Web developers
  • web designers
  • anyone who wants to create their own website with code
  • anyone who wants to learn about responsive web design
  • anyone who wants to make custom websites