Hello Coders,
This article presents an open-source Flask Dashboard coded on top of a modern UI - Star Admin (Free Version), provided by BootstrapDash. For newcomers, Star Admin is a beautifully designed admin template featuring a fine selection of useful Bootstrap components and elements. Star Admin has impressive typography that compliments exceedingly with its colorful and elegant interface.
- Star Admin Flask - product page
- Star Admin Flask PRO - more pages, components
Star Admin (HTML)
Vendor Notes (BootstrapDash) - Star Admin is a free responsive admin template built with Bootstrap 4. The template has a colorful, attractive yet simple and elegant design. The template is well crafted, with all the components neatly and carefully designed and arranged within the template.
Star Admin is packed with all the features that fit your needs but not cramped with components you would not even use. It is an excellent fit to build admin panels, e-commerce systems, project management systems, CMS, or CRM.
In case anyone has the curiosity to build the HTML files, please access the official repository - Star Admin Free Dashboard, clone the code and follow the instructions provided in the README file.
Star Admin - HTML files build
$ # Clone the sources
$ https://github.com/BootstrapDash/StarAdmin-Free-Bootstrap-Admin-Template.git star-admin
$ cd star-admin
$
$ # Install Moduled
$ yarn
$
$ # Compile files
$ gulp serve
The tooling provided in the HTML version is using Gulp to compile SCSS and JS Vendor libs. This toolchain is not state-of-the-art but is working and does the job.
Star Admin Flask
The project is a simple, unopinionated Flask starter coded with a short-list of modules and deployment scripts for some well-known platforms: Docker, Heroku - app features:
- SQLite, PostgreSQL, SQLAlchemy ORM
- Alembic (DB schema migrations)
- Modular design with Blueprints
- Session-Based authentication (via flask_login)
- Forms validation
- Deployment scripts: Docker, Gunicorn / Nginx, Heroku
- Active Support via Github and Discord.
How to use the code
To use the stater, Python3 should be installed properly in the workstation. If you are not sure if Python is properly installed, please open a terminal and type python --version. The full-list with dependencies and tools required to build the app:
- Python3 - the programming language used to code the app
- GIT - used to clone the source code from the Github repository
- Basic development tools (g++ compiler, python development libraries ..etc) used by Python to compile the app dependencies in your environment.
For more information on how to set up your environment please access the resources listed below. In case I've missed something, feel free to ask me anything in the comments - I'm here on Dev almost daily.
- How to set up Python
- Setup CentOS for development
- Setup Ubuntu for development
- Setup Windows for development
App Codebase (simplified)
Starter uses a simple codebase, with two Blueprints and a structure presented below:
< 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
|
|-- ************************************************************************
Compile the sources
To built and start the Star Admin Flask locally, we need to clone the public repository or download the ZIP archive and after prepare and compile the source code.
$ # Get the code
$ git clone https://github.com/app-generator/flask-star-admin.git
$ cd flask-star-admin
$
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules - SQLite Database
$ pip3 install -r requirements.txt
$
$ # Set the FLASK_APP environment variable
$ export FLASK_APP=run.py
$
$ # Start the application (development mode)
$ flask run
$
$ # Access the dashboard in browser: http://127.0.0.1:5000/
If all goes well, we should see the app running in the browser. To unlock the private pages and pass the login, first, we need to create a new user using the registration page:
After we pass the login, the app will unlock some nice pages:
Star Admin - Flask, UI Elements
Star Admin - Flask, Dashboard Page
Star Admin - Flask, ChartsPage
Thanks for reading! Let me know your thoughts in the comments.
Links & Resources
- Star Admin Flask - product page, hosted by AppSeed
- More Flask Dashboards - index hosted by AppSeed
More about Flask
Flask is a lightweight WSGI web application framework. It is designed to make getting started quick and easy, with the ability to scale up to complex applications. It began as a simple wrapper around Werkzeug and Jinja and has become one of the most popular Python web application frameworks.
By using a framework we can reuse modules and features already coded and tested by other developers. Using Flask we can skip over coding from scratch a few modules, common to many web apps:
- Authentication - we need to know who is using our app
- ORM - to manipulate the database information with ease
- Routing - for sure we can code our own routing system .. but, why?!
- Deployment - Flask is well documented when we need to deploy our work in production.
- Community - using a Framework we can get help from other fellow developers that might face the same issues
Compared to his older brother Django, Flask provides much freedom to the developer because only offers suggestions, but does not enforce any dependencies for project layout.
To read more about Flask, please access:
- Flask - official website
- Flask Documentation - recommended starting point for newcomers
Top comments (0)