Bootstrap 5bootstrap components built with Reactreact.
!GitHub Actions CI statusgh-actions-badgegh-actions !Travis CI Build statustravis-badgetravis !npmnpm-badgenpm !Codecovcodecov-badgecodecov !Discorddiscord-badgediscord !Netlifynetlify-badgenetlify
Bootstrap compatibilityReact-Bootstrap is compatible with various versions of Bootstrap. As such, you need to ensure you are using the correct combination of versions.
See the below table on which version of React-Bootstrap you should be using in your project.
| Bootstrap Version | React-Bootstrap Version | Documentation | | ------------- |:-------------:| -----:| | v5.x | 2.x | Linkv5-documentation | | v4.x | 1.x | Linkv4-documentation | | v3.x | 0.33.x (not maintained) | Linkv3-documentation |
Migrating from previous versions
Bootstrap 4 to Bootstrap 5If you would like to update React-Bootstrap within an existing project to use Bootstrap 5, please read our docs for migrating to React-Bootstrap V2v5-migration.
Bootstrap 3 to Bootstrap 4If you would like to update React-Bootstrap within an existing project to use Bootstrap 4, please read our docs for migrating to React-Bootstrap V1v4-migration.
- react-router-bootstrapreact-router-bootstrap – Integration with React Routerreact-router
- Awesome React Bootstrap Componentsawesome-react-bootstrap-components - Additional components like off-canvas navbar, switch and sliders.
Local setupYarn is our package manager of choice here. Check out setup instructions here if you don't have it installed already. After that you can run
yarn run bootstrapto install all the needed dependencies.
From there you can:
- Run the tests once with
yarn test(Or run them in watch mode with
yarn run tdd).
- Start a local copy of the docs site with
- Or build a local copy of the library with
yarn run build
CodeSandbox ExamplesClick here to explore some React-Bootstrap CodeSandbox examples.
Click here to automatically open CodeSandbox with the React-Bootstrap CodeSandbox Examples GitHub Repository as a workspace.