AboutTeamsPricing
New content added weeklyLive

Master Bootsrap with Adaptive AI.

Master Bootsrap across 19 topics - Foundations, Intermediate, and Advanced - guided by Leyaa's adaptive intelligence.

3Parts
19Topics
151Patterns
40hEst. duration
Start Learning Free
Bootsrap
Bootsrap Course
3 - part learning journey
Beginner
Foundations
6 topics · 51 patterns
Beginner
Intermediate
Intermediate
7 topics · 55 patterns
Intermediate
Advanced
Advanced
6 topics · 45 patterns
Advanced
Begin Part 1: Foundations
✦ Course Structure

Your Bootsrap Journey in 3 Parts

Each part builds on the last - a deliberate progression from beginner to advanced.

Beginner
Beginner
Part 1: Foundations
Covers Bootstrap Basics and Setup, Grid System Fundamentals, Responsive Grid and 3 more topics.
6Topics
51Patterns
View topics
Intermediate
Intermediate
Part 2: Intermediate
Covers Navigation Components, Card and Content Components, Modal and Overlay Components and 4 more topics.
7Topics
55Patterns
View topics
Advanced
Advanced
Part 3: Advanced
Covers Layout Patterns, Customization with SASS, JavaScript Components and 3 more topics.
6Topics
45Patterns
View topics
Curriculum

Everything You'll Learn

Explore every topic and pattern in the course.

Bootsrap

3 parts · 19 topics · 151 patterns
Beginner
Part 1: Foundations6 topics · 51 patterns
Beginner
01
Bootstrap Basics and Setup
7 patterns
Why Bootstrap exists
Component-based framework philosophy
Bootstrap vs Tailwind comparison
CDN setup vs npm installation
Bootstrap folder structure
Importing Bootstrap in projects
First Bootstrap page
02
Grid System Fundamentals
8 patterns
Why a grid system matters
Container types (container, container-fluid)
Row and column structure
12-column grid model
Column sizing (col-1 through col-12)
Auto-sizing columns
Equal-width columns
Mixing column widths
03
Responsive Grid
8 patterns
Why responsive breakpoints matter
Breakpoint tiers (xs, sm, md, lg, xl, xxl)
Responsive column classes
Column stacking on mobile
Offset columns
Column ordering
Nesting rows and columns
Gutters and spacing control
04
Typography and Content
8 patterns
Why consistent typography matters
Heading classes
Display headings
Lead paragraphs
Text alignment utilities
Text wrapping and overflow
Text transform utilities
List styles (unstyled, inline)
05
Utility Classes
10 patterns
Why utility classes speed development
Spacing utilities (margin, padding)
Color utilities (text, background)
Border utilities
Sizing utilities (width, height)
Display utilities
Flex utilities
Float and clear utilities
Visibility utilities
Shadow utilities
06
Buttons and Forms
10 patterns
Why consistent interactive elements matter
Button styles and variants
Button sizes
Button groups
Form control basics
Input groups
Select menus
Checkboxes and radios
Form layout (inline, horizontal)
Form validation styles
Intermediate
Part 2: Intermediate7 topics · 55 patterns
Intermediate
01
Navigation Components
8 patterns
Why navigation structure matters
Navbar basics
Navbar brand and toggler
Responsive navbar collapse
Navbar color schemes
Nav tabs and pills
Breadcrumb component
Pagination component
02
Card and Content Components
8 patterns
Why cards organize content
Card structure (header, body, footer)
Card images and overlays
Card groups and decks
List group component
List group with badges
Accordion component
Accordion flush variant
03
Modal and Overlay Components
8 patterns
Why modals focus user attention
Modal structure and triggers
Modal sizes and positioning
Scrollable and centered modals
Offcanvas component
Tooltip component
Popover component
Toast notifications
04
Alert and Feedback Components
7 patterns
Why user feedback is critical
Alert variants and colors
Dismissible alerts
Progress bars
Spinner components
Badge component
Close button component
05
Carousel and Media
8 patterns
Why media components enhance content
Carousel slides and controls
Carousel indicators
Carousel captions
Responsive images
Figure component
Ratio utilities for embeds
Image thumbnails
06
Table and Data Display
8 patterns
Why structured data needs styling
Basic table styling
Striped and hover tables
Bordered and borderless tables
Table color variants
Responsive tables
Table caption placement
Small and compact tables
07
Dropdown and Collapse
8 patterns
Why expandable content saves space
Dropdown button basics
Dropdown menu alignment
Split button dropdowns
Dropdown directions (up, left, right)
Collapse component
Multi-target collapse
Horizontal collapse
Advanced
Part 3: Advanced6 topics · 45 patterns
Advanced
01
Layout Patterns
7 patterns
Why layout patterns solve common needs
Holy grail layout with Bootstrap
Sticky footer pattern
Sidebar with content area
Dashboard layout
Landing page sections
Masonry-style grid with columns
02
Customization with SASS
8 patterns
Why customization avoids generic look
Bootstrap SASS variable overrides
Custom color themes
Custom breakpoints
Modifying spacing scale
Importing only needed components
Creating custom component variants
Build tools configuration
03
JavaScript Components
8 patterns
Why interactive components need JavaScript
Modal JavaScript API
Tooltip and popover initialization
Carousel programmatic control
Collapse toggle via JavaScript
Dropdown events and methods
ScrollSpy component
Tab navigation via JavaScript
04
Bootstrap Icons
7 patterns
Why icon integration matters
Bootstrap Icons library setup
Icon font usage
SVG icon usage
Icon sizing and colors
Icons in buttons and inputs
Custom icon integration
05
Accessibility in Bootstrap
7 patterns
Why accessibility is a requirement
ARIA attributes in Bootstrap components
Keyboard navigation support
Screen reader utilities
Focus management in modals
Color contrast considerations
Reduced motion support
06
Migration and Best Practices
8 patterns
Why staying current matters
Bootstrap 4 to 5 migration
RTL (right-to-left) support
Performance optimization
Avoiding common Bootstrap mistakes
Bootstrap with React (react-bootstrap)
Bootstrap with Vue (bootstrap-vue-next)
When to use Bootstrap vs alternatives
Why Leyaa

Not just a course. A learning intelligence.

Leyaa doesn't just deliver content - it understands where you are, what you need, and how to get you there fastest.

Adaptive Diagnostics
Adaptive Diagnostics
Leyaa identifies which of the 151 patterns you've mastered and which need work - before you waste time on what you already know.
Pattern-Level Precision
Pattern-Level Precision
Every pattern gets a verdict - Learn, Practice, or Skip - so your study time goes exactly where it counts.
Intelligent Pacing
Intelligent Pacing
Leyaa reads your velocity across the whole course and adapts your focus list dynamically, keeping you in the optimal learning zone.
Before & After Visibility
Before & After Visibility
Every assessment creates a snapshot. Retake anytime to see exactly how much you've grown - topic by topic, pattern by pattern.
Learner Autonomy
Learner Autonomy
Leyaa recommends, never restricts. Override any suggestion and explore at your own pace - the system tracks everything regardless.
Clear Learning Path
Clear Learning Path
Foundations → Intermediate → Advanced - a structured journey where each part sets you up perfectly for the next.
Bootsrap

Ready to master Bootsrap?
Start your journey today

Start your diagnostic now. Build mastery across all 19 topics in under 15 minutes.

19 Topics
151 Patterns
Personalized roadmap
Leyaa Swift Bird