bootstrap-overviewlisted
Install: claude install-skill ronnieiscoo/bootstrap-expert
# Bootstrap 5.3 Overview
Bootstrap 5.3.8 is a powerful front-end framework for building responsive, mobile-first websites. This skill covers installation, project setup, and foundational concepts.
## Quick Start Options
### CDN (Fastest Setup)
For prototyping or simple projects, use CDN links. Include CSS in `<head>` and JS before closing `</body>`:
```html
<!-- CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI" crossorigin="anonymous"></script>
```
Always use `bootstrap.bundle.min.js` (includes Popper.js) unless separately managing Popper.
### Package Manager Installation
**npm:**
```bash
npm install bootstrap@5.3.8
```
**yarn:**
```bash
yarn add bootstrap@5.3.8
```
**pnpm:**
```bash
pnpm add bootstrap@5.3.8
```
**Bun:**
```bash
bun add bootstrap@5.3.8
```
After installation, import in JavaScript:
```javascript
import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/js/bootstrap.bundle.min.js';
// Or import specific components
import { Modal, Tooltip } from 'bootstrap';
```
### ES Module Usage
For native ESM usage in browsers without a bundler, use `bootstrap.esm.min.js`