⚡️Volt - Open Source Bootstrap 5 Admin Dashboard (Vanilla JS)
Zoltán Szőgyényi
Posted on August 23, 2020
Volt is a free and open source Bootstrap 5 Admin Dashboard featuring over 100 components, 11 example pages and 3 plugins with Vanilla JS.
Bootstrap 5 and Vanilla Javascript
Volt is built using the latest version of Bootstrap 5 and because jQuery is no longer required as a dependency, Volt has been built using only Vanilla JS.
100+ Components
There are more than 100 free Bootstrap 5 components included some of them being buttons, alerts, modals, datepickers and so on. Check out the components on the official documentation.
11 Example Pages
Volt brings 11 example pages including an overview, sign in, sign up, transactions page and many more.
3 Lightweight Plugins
There are 3 lightweight and Vanilla JS plugins that come with Volt, namely a date picker, notification and charts library.
Advanced development flow
By downloading you will get an advanced development workflow package including Sass files and a Gulp commands file that will let you build minified and un-minified project files with the ability to even add certain blocks of code based on your environment.
Well documented
Volt is a thoroughly documented dashboard which covers everything from getting started to having all of the components and plugins well described. Check out our quick start guide.
Open source project
Volt is a free and open source project under the MIT License so if you appreciate this project you can give the public Github repository a star and spread the open source love ❤️.
Quick start
- Download from Themesberg or clone this repository
- Download the project's zip
- Make sure you have Node locally installed.
- Download Gulp Command Line Interface to be able to use gulp in your Terminal.
npm install gulp-cli -g
- After installing Gulp, run npm install in the main
volt/
folder to download all the project dependencies. You'll find them in thenode_modules/
folder.
npm install
- Run gulp in the
volt/
folder to serve the project files using BrowserSync. Running gulp will compile the theme and open/index.html
in your main browser.
gulp
While the gulp command is running, files in the assets/scss/
, assets/js/
and components/
folders will be monitored for changes. Files from the assets/scss/
folder will generate injected CSS.
Hit CTRL+C
to terminate the gulp command. This will stop the local server from running.
Theme without Sass, Gulp or Npm
If you'd like to get a version of our theme without Sass, Gulp or Npm, we've got you covered. Run the following command:
gulp build:dev
This will generate a folder html&css
which will have unminified CSS, Html and Javascript.
Minified version
If you'd like to compile the code and get a minified version of the HTML and CSS just run the following Gulp command:
gulp build:dist
This will generate a folder dist
which will have minified CSS, Html and Javascript.
Documentation
The documentation for Volt is hosted on our website.
File Structure
Within the download you'll find the following directories and files:
Volt Bootstrap 5 Admin Dashboard
.
├── README.md
├── gulpfile.js
├── package-lock.json
├── package.json
└── src
├── assets
│ ├── img
│ └── js
├── index.html
├── pages
│ ├── components
│ ├── dashboard
│ ├── examples
│ ├── settings.html
│ ├── tables
│ └── transactions.html
├── partials
│ ├── _analytics.html
│ ├── _footer.html
│ ├── _head.html
│ ├── _navigation.html
│ ├── _pages-preview.html
│ ├── _preloader.html
│ ├── _scripts.html
│ └── dashboard
└── scss
├── volt
└── volt.scss
Upgrade to Pro
There is also a pro version of Volt which has more than 800 components, 20 example pages, and over 10 advanced plugins that can take your admin dashboard application to the next level. Check out Volt Pro Premium Bootstrap 5 Admin Dashboard.
Posted on August 23, 2020
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.