Hello Coders,
This article demonstrates how to push LIVE a production-ready Flask dashboard using the Heroku platform and a few simple configuration scripts.
Thank you! Content provided by AppSeed - App Generator.
The final product Adminator Flask Dashboard is an open-source product generated by AppSeed platform in Flask using the free Adminator UI Kit.
In a rush?
Let's see something on the screen with a few actions:
- Create a free account on Heroku
- Open a terminal window and clone the sample project:
$ git clone https://github.com/app-generator/flask-dashboard-adminator.git
$ cd flask-dashboard-adminator
Authenticate into Heroku platform using the terminal
$ heroku login
heroku: Press any key to open up the browser to login or q to exit:
Opening browser to https://cli-auth.heroku.com/auth/cli/browser/0d71eacf-151a-462d-9ba6-9c9502b9e3dc
Logging in... done
Logged in as sm0ke@something.com
Push the project into Heroku platform
$ heroku create
Creating app... -
Creating app... done, ⬢ morning-retreat-24780
https://morning-retreat-24780.herokuapp.com/ | https://git.heroku.com/morning-retreat-24780.git
The app is created using a random name morning-retreat-24780 and should be visible on the Heroku dashboard. If you want a particular name, just execute the create command with a third argument:
$ heroku create predator-vs-rocky
The last step - Trigger the build and Deploy the app
$ git push heroku master
Counting objects: 138, done.
Delta compression using up to 4 threads.
...
... boring messages
... more boring messages
...
... .. <('_')> .. <---- This is my hacky avatar and has nothing to do with anything
...
remote: https://morning-retreat-24780.herokuapp.com/ deployed to Heroku
remote:
remote: Verifying deploy... done.
To https://git.heroku.com/morning-retreat-24780.git
* [new branch] master -> master
At this point, the app should be successfully deployed and we can access it from the terminal by typing heroku open or by visiting the Heroku dashboard and click on Open App button.
That was easy right?
More automation
Heroku let you connect the app to the real Git account and trigger automatic builds when a new commit occurred.
Connect the app to the Github repo
Enable automatic deploy
The relevant files:
To have a successful deployment, Heroku expects some files to be present in the project before we execute git push heroku master
- runtime.txt - optional file that specify the python verison to be used
- Procfile - trigger the deployment via Gunicorn. The file contains only one line:
web: gunicorn run:app --log-file=-
The argument to the Gunicorn command, run:app is the WSGI app, constructed by the run.py file:
# Contents of run.py
from app import app, db
if __name__ == "__main__":
app.run()
In case you find this post useful and want to play with more flask dashboards, already provisioned with deployment scripts for Heroku, Docker, Gunincorn, and Waitress, feel free to access the links:
- Flask Dashboard Black - UI-ready Admin panel - LIVE Demo
- Flask Admin Panel Argon - LIVE Demo - MIT License
The full-list with open-source admin dashboards is published on Github.
Links and Resources
A short-list with resources that help the audience to accommodate faster with the topics presented here.
Flask Framework
Flask Framework 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.
Heroku
Heroku is a cloud platform as a service supporting several programming languages. One of the first cloud platforms, Heroku has been in development since June 2007, when it supported only the Ruby programming language, but now supports Java, Node.js, Scala, Clojure, Python, PHP, and Go.
AppSeed
AppSeed, the provider of this free product, is a platform that uses automation tools and boilerplate code to provide UI-Ready web apps coded in various patterns and programming languages: Admin Dashboards, Static Sites built with 11ty and Panini SSG, JAMstack starters.
Adminator
Adminator is a responsive Bootstrap 4 Admin Template crafted by ColorLib. It provides you with a collection of ready to use code snippets and utilities, custom pages, a collection of applications and some useful widgets.
Thank you for reading! Let me know your thoughts in the comments.
Top comments (0)