The easiest way to get your hands dirty is to start with one of the starter kits:
- Starter Vanilla (Preview)
Creates a basic page using Bonaparte components without any framework. - Starter React (Preview)
Creates a basic page using Bonaparte components and the React framework.
Each starter includes all Bonaparte components and the Napoleon theme (Napoleon Build).
- Download/Clone the starter for your favorite framework
- Open
index.html
in a browser.
To include all Bonaparte Components:
- Download/Clone one of the Bonaparte builds:
- Pure Build
Includes all Bonaparte Components without any design. - Napoleon Build
Includes all Bonaparte Components and the Napoleon theme
- Copy the complete
dist/
folder into your project. - Include the following into the
<head>
of your project:
<link rel='stylesheet' type="text/css" href='path/to/dist/bonaparte.css'>
<script src='path/to/dist/bonaparte.js'></script>
Creating your own custom build to include only a subset of components is simple as well!
Learn more: 4.1 Custom Build
Each component can also be used separately:
- Download/Clone any of the Bonaparte components.
- < bonaparte-button >
- < bonaparte-draggable >
- < bonaparte-dropdown >
- < bonaparte-panel >
- < bonaparte-scroll >
- < bonaparte-sidebar >
- < bonaparte-toolbar >
- Copy the complete
dist/
folder into your project. - Include the following into the
<head>
of your project:
<link rel='stylesheet' type="text/css" href='path/to/dist/bonaparte.css'>
<script src='path/to/dist/bonaparte.js'></script>