Flask Bootstrap 5 - Volt Admin Dashboard (Free)
Hello Coders,
This article presents an open-source Flask Bootstrap 5 seed project crafted with authentication, ORM and deployment scripts on top a modern jQuery-free design - Volt Dashboard. For newcomers, Flask is a lightweight web application framework written in Python. Sometimes classified as a microframework, Flask provides a lightweight codebase that can be easily extended to become an API, a simple web app, or a complex eCommerce platform.
Thank you for reading!
- Flask Bootstrap 5 Volt - product page
- Flask Bootstrap 5 Volt - Demo - LIVE deployment
The project comes with basic modules like session-based authentication, database, Flask-SqlAlchemy ORM, Blueprints and deployment scripts for Docker, HEROKU and Gunicorn/Ngynx.
For those that find this codebase hard to digest, this Bootstrap 5 design can be donwloaded as a Jinja Template (simple Flask codebase without database or other hard dependencies).
- Jinja Volt
- Jinja Volt - Demo - LIVE deploy
Flask Codebase Features
- DBMS: SQLite, PostgreSQL (production)
- DB Tools: SQLAlchemy ORM, Alembic (schema migrations)
- Modular design with Blueprints
- Session-Based authentication (via flask_login), Forms validation
- Deployment scripts: Docker, Gunicorn / Nginx, Heroku
- Support via Github (issues tracker) and Discord.
The codebase uses Blueprints, a pattern that allows a modular design and structure for Flask applications. The (simplified) structure of the project is shown below using an ASCII chart:
< PROJECT ROOT >
|
|-- app/ # Implements app logic
| |-- base/ # Base Blueprint - handles the authentication
| |-- home/ # Home Blueprint - serve UI Kit pages
| |
| __init__.py # Initialize the app
|
|-- requirements.txt # Development modules - SQLite storage
|-- requirements-mysql.txt # Production modules - Mysql DMBS
|-- requirements-pqsql.txt # Production modules - PostgreSql DMBS
|
|-- .env # Inject Configuration via Environment
|-- config.py # Set up the app
|-- run.py # Start the app - WSGI gateway
|
|-- ********************************************************
How the app starts
run.py
loads the.env
file- Initialize the app using the specified profile: Debug or Production
- If env.DEBUG is set to True the SQLite storage is used
- If env.DEBUG is set to False the specified DB driver is used (MySql, PostgreSQL)
- Call the app factory method
create_app
defined in app/init.py - Redirect the guest users to Login page
- Unlock the pages served by home blueprint for authenticated users
How to compile the code
To use the project, Python3 and GIT command tool are required. The first one is the ground base for Flask and GIT helps us to clone (download) the sources directly from the public repository. Please find below the steps to compile Flask Dashboard Volt from sources:
Download the code
$ git clone https://github.com/app-generator/flask-dashboard-volt.git
$ cd flask-dashboard-volt
Install Modules
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules - SQLite Database
$ pip3 install -r requirements.txt
Start the app
$ # Set the FLASK_APP environment variable
$ export FLASK_APP=run.py
$
$ # Start the application (development mode)
$ flask run
Once the app starts ( visit http://localhost:5000
in the browser), we can register a new user and login.
Flask Bootstrap 5 - Main Dashboard Screen
Flask Bootstrap 5 - 404 Page
Flask Bootstrap 5 - UI Alerts
Thank you for reading! Feel free to ask me anything in the comments regarding the usage of this Flask Bootstrap 5 or access below links for more resources:
- Access Themesberg for more UI Kits
- Access AppSeed for more seed projects