O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Mastering Bootstrap 4

Video Description

Build powerful and beautiful websites with the Bootstrap 4 framework

About This Video

  • Work with the latest updates in the Bootstrap 4 framework

  • Explore various Bootstrap components and tools to develop websites as you find best

  • Extend Bootstrap with jQuery plugins and learn how to create your own custom plugins

  • In Detail

    Bootstrap is a free and open source front-end web framework for designing websites and web applications. This course will help you learn to use Bootstrap within your web projects for more rapid development. You’ll explore how you can use CSS classes within your HTML to bring Bootstrap functionality to your project.

    You’ll start by getting to grips with using containers, grids, and Typography in Bootstrap as well as forms, buttons, navigation, and other interface components. Then, you’ll get to work with alerts, navigation components, and responsive queries. Moving forward, you’ll work with Bootstrap forms and queries, and access resources that will help you build attractive websites.

    After that, you’ll find out how to use utility classes and various form options. Among other things, you will also tour the anatomy of a Bootstrap plugin, create your own custom components, and extend Bootstrap using jQuery.

    By the end of this course, you will have a thorough knowledge of the framework’s ins and outs, and be able to build highly customizable and optimized web interfaces.Your websites and projects of all sizes will work across multiple screens sizes perfectly with Bootstrap.

    Table of Contents

    1. Chapter 1 : Getting to Know Bootstrap
      1. The Course Overview 00:07:27
      2. Getting Bootstrap – Download - CDN 00:07:00
      3. Adding Bootstrap to Web Projects 00:07:07
      4. What is Bootstrap? 00:06:42
    2. Chapter 2 : Breakdown of Bootstrap
      1. Bootstrap Containers 00:05:51
      2. Creating a Bootstrap Template 00:05:36
      3. The Grid System 00:08:37
      4. Bootstrap Columns and Rows 00:10:28
      5. Bootstrap Jumbotron 00:04:23
      6. Bootstrap Typography 00:12:17
    3. Chapter 3 : Tools and Components
      1. Text Styles 00:09:46
      2. Bootstrap Cards 00:10:32
      3. Bootstrap Images 00:06:27
      4. Bootstrap Nav 00:06:29
      5. Bootstrap Buttons 00:05:03
      6. Bootstrap Button Grouping 00:06:51
      7. Bootstrap Alignments and Styling 00:05:20
      8. Bootstrap Other Components 00:08:34
    4. Chapter 4 : Going further with Bootstrap
      1. Glyphicons and Font Awesome 00:05:53
      2. Bootstrap Alerts 00:05:40
      3. Bootstrap Pagination 00:04:37
      4. Bootstrap Nav 00:09:44
      5. Bootstrap Navbars 00:07:28
      6. Responsive Media Queries 00:07:58
    5. Chapter 5 : Bootstrap Useful Components
      1. Forms working with Field 00:06:37
      2. Bootstrap Forms 00:16:31
      3. Bootstrap Responsive Utilities 00:04:14
    6. Chapter 6 : Bootstrap Resources
      1. Useful Web Resources for Better Building 00:09:44
      2. Bootstrap Template Resource 00:03:46
      3. Bootstrap Templates 00:03:52
    7. Chapter 7 : Adding jQuery
      1. Setting up jQuery 00:05:17
      2. CDN and what can be done with jQuery 00:10:34
    8. Chapter 8 : jQuery and Bootstrap
      1. Bootstrap ToolTips 00:05:56
      2. Bootstrap 4 Modal 00:08:07
      3. Bootstrap 4 Carousel 00:08:30
      4. Bootstrap 4 Carousel options 00:04:14
      5. Bootstrap 4 ScrollSpy 00:05:17
    9. Chapter 9 : Simple Single Page Website
      1. Planning Design Website Concept 00:03:03
      2. Creating Template and Container 00:03:03
      3. Add Placeholder Content and Sections 00:04:11
      4. Create Navbar 00:06:24
      5. Create the Content Area 00:08:59
      6. Update and Tweak Layout 00:04:56
      7. Add custom Styling and Fonts 00:10:32
      8. Create Functionality Using JQuery 00:06:56
    10. Chapter 10 : Multi Page Website
      1. Planning Design Website Concept 00:06:22
      2. Creating Template and Container 00:04:57
      3. Adding placeholder Content and Sections 00:05:02
      4. Creating Navbar 00:05:33
      5. Creating the Content Area 00:06:53
      6. Creating Contact Form 00:07:10
      7. Creating Portfolio page 00:06:51
      8. Updating and Tweak Layout 00:02:58
      9. Adding Custom Styling and Fonts 00:03:48
      10. Creating Functionality Using JQuery 00:07:46
      11. Adding in Bootstrap jQuery Components 00:07:07