⚡️Volt - Open Source Bootstrap 5 Admin Dashboard (Vanilla JS)

zoltanszogyenyi

Zoltán Szőgyényi

Posted on August 23, 2020

⚡️Volt - Open Source Bootstrap 5 Admin Dashboard (Vanilla JS)

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

  1. Download from Themesberg or clone this repository
  2. Download the project's zip
  3. Make sure you have Node locally installed.
  4. Download Gulp Command Line Interface to be able to use gulp in your Terminal.
npm install gulp-cli -g
Enter fullscreen mode Exit fullscreen mode
  1. After installing Gulp, run npm install in the main volt/ folder to download all the project dependencies. You'll find them in the node_modules/ folder.
npm install
Enter fullscreen mode Exit fullscreen mode
  1. 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
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

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
Enter fullscreen mode Exit fullscreen mode

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.

💖 💪 🙅 🚩
zoltanszogyenyi
Zoltán Szőgyényi

Posted on August 23, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related