Bootstrap Python Flask - Volt Dashboard

Volt Dashboard is a simple seed project crafted in Bootstrap 5 and Flask, a popular Python web framework - open-source product.

Bootstrap Python Flask - A nice combination for a modern project.
Bootstrap Python Flask - A nice combination for a modern project.

This article presents an open-source seed project crafted with Bootstrap and Flask, a popular Python web framework. The product might be useful to bootstrap faster a new dashboard project using a nice combination of modern frameworks. Bootstrap is one of the most popular CSS Frameworks and Flask is a lightweight and beginner-friendly framework.  

Bootstrap Python Flask - A modern page with a left menu and many charts and widgets in center.
Bootstrap Python Flask - Main Dashboard Screen

This modern design is provided by Themesberg using Bootstrap 5 and Vanilla JS without jQuery dependency or other hard dependencies.

Volt Dashboard - Official Product Information

Volt is a free and open-source Bootstrap 5 Dashboard Template featuring over 100 components, 11 pre-built pages, and 3 plugins with Vanilla JS.  This UI kit comes with 100+ handcrafted Bootstrap 5 components included some of them being buttons, alerts, modals, date pickers, widgets, and charts.

Volt Bootstrap 5 brings 11 example pages including an overview, sign in, sign up, transactions page, user profile with the possibility to add new ones with ease.

Bootstrap Python Flask - A modern page with a left menu and user profile controls in center.
Bootstrap Python Flask - User Profile Page
Volt Bootstrap 5 - UI Popups
Bootstrap Python Flask - A modern page with a left menu and a dark-themed popup in center.
Bootstrap Python Flask - UI Popups 

The product uses the latest Bootstrap 5 stable version (at the moment this article is edited) installed via package.json and the UI can be customized via SASS files.

Flask Codebase

A few basic features are shipped with this starter: session-based authentication, modular codebase (blueprints), and deployment scripts for Docker and HEROKU. In order to compile the source code, we need to install a minimal programming kit:

  • A modern editor - VSCode or Atom
  • Nodejs - used in Javascript-based products and tools
  • Yarn - a popular package manager for NodeJS (better than NPM)
  • Python - a modern script language used for many types of projects
  • GIT - a command-line tool used to download sources from Github
  • Gulp - a toolkit to automate repetitive tasks

Once we have this minimal toolchain properly installed in the system we can download the sources from Github and start the project:

Step #1 - Download the sources using GIT

$ git clone
$ cd flask-dashboard-volt
Flask Volt Dashboard - Download Sources

Step #2 - Install dependencies using a virtual environment

$ virtualenv env
$ source env/bin/activate
$ pip3 install -r requirements.txt
Flask Volt Dashboard - Install Dependencies

Step #3 - Set up the environment

$ (Unix/Mac) export
$ (Windows) set
$ (Powershell) $env:FLASK_APP = ".\"
Flask Volt Dashboard - Set up Environment

Step #4 - Start the app

$ flask run
$ # Access the dashboard in browser:
Flask Volt Dashboard - Start the App

If all goes well, the app should be accessible in the browser. By default, the guest users are redirected to the login page and we need to provide a registered user in order to access the private pages: dashboard, user profile, UI components pages.

Bootstrap Python Flask - Login Page.
Bootstrap Python Flask - Login Page.

Thanks for reading! For more resource and support please access:

Volt PRO is a premium Bootstrap 5 Admin Dashboard featuring over 800 components, 20 example pages, and 10 fully customized plugins written in Vanilla Javascript. It combines colors that are easy on the eye, spacious cards, beautiful typography, and graphics.

Bootstrap Python Flask - a premium web page with a dark left menu and pixel-perfect charts and widgets in the center on the view.
Bootstrap Python Flask - Premium Dashboard