Bootstrap 4 Online Course
Discover how Bootstrap 4 streamlines web development by offering a robust set of pre-built components and responsive design tools. This course teaches you how to leverage the world’s most widely used front-end framework to quickly build polished, user-friendly web interfaces.
You’ll start with an introduction to Bootstrap and its latest version, Bootstrap 4, gaining a practical understanding of how to set up and use its features alongside SASS for custom styling. Through hands-on lessons, you’ll build a real-world application called Neighborhood, designed to help users find local businesses in their area. Along the way, you'll master responsive grid systems, create advanced UI components with Cards, and structure your styles using SASS.
Who should take this Course?
The Bootstrap 4 Online Course is a practical, hands-on program designed to teach learners how to build responsive and mobile-first websites using the Bootstrap 4 framework. It covers key concepts such as the grid system, components, utilities, flexbox, and customization techniques. Ideal for web developers, designers, and students, the course enables learners to quickly prototype and design modern, visually appealing websites with minimal coding. Whether you're a beginner or looking to upgrade your frontend skills, this course provides a solid foundation in Bootstrap 4.
Course Curriculum
Introduction and Setup
- The Course Overview
- Bootstrap 4 New Features
- Setup and Tools
SaSS Crash Course
- Limitations of CSS
- Setting Up Your First SaSS Project
- Variables and Nesting
- Mixins, Extends, and Partials
Introduction to Bootstrap 4 with SaSS
- Setting Up Bootstrap with SaSS
- Adding an Example Starter Page
- Creating Our First Bootstrap
- Adding Personality with Overrides
The Grid System
- Grids – A Conceptual Overview
- Using the Grid Layout
- Adding Nested Grids and Complex Layouts
- Going Mobile with the Bootstrap Grid
Forms and Tables
- Bootstrap Forms
- Creating Our Sign-In Page
- Bootstrap and Tables
- Creating Our Pricing Page
Bootstrap 4 JS Components
- Modals
- Popovers and Tooltips
- Carousels
- Dropdowns
The Final Steps
- Publishing Your Page
- Bootstrap Best Practices
- Where to Go from Here?