May 13, 2022 • 3 min read

Streamlit: Python Dashboards to Monitor your Django Database.

Rédigé par Laurent Montier

Laurent Montier

In this article, I will show you how to quickly build Dashboards with Streamlit and connect them to your Django Web App.

Disclaimer: this article assumes you are familiar with the Django Framework.

Build Web Apps in Pure Python

Django, an awesome Python tool to build production-ready Backends

As a Data Scientist, I often work with Django if I need to create a web app, since it is a Python Framework. Indeed, Django allows you to simply write your API and your Database models in Python. For the User Interface (Frontend), you need to choose one of the following tech:

  • HTML + Jinja2: the Django built-in Dynamic HTML Templates, which basically let you inject your database model values inside static HTML
  • Javascript: traditional JavaScript Frameworks such as React or Angular
  • Python: the Django Admin site which allows you to access and interact with your Database models in pure Python.

Since 95% of my developing skills revolve around Python, I was very interested in using the third option. However, and as stated in the Django doc, the Admin site is “not intended for building your entire front end around”. Indeed, it is more designed to interact with your Database than to produce nice visuals.

This leads us to Streamlit, a great app framework that we use a lot at Sicara which let us build Customizable Dashboards in Python using DVC + Streamlit.

Django Admin site for a Classification Web App

Streamlit, an awesome Python tool to build Dashboards

Streamlit is a python library that we love at Sicara. It let you write Dashboards or simple web apps in pure Python. It is the perfect tool to build Data Science apps, and can be used for instance to make some object detection dataset, image annotation, or more generally Customizable Web UI for Machine Learning.

In the next session, I will show you how you can use Streamlit to quickly build a Dashboard that interacts with Django.

Let’s Do Streamlit Dashboard to monitor your Django Database!

To illustrate this, we are going to create a Django app to host your Classification Database. As you know, when working with custom Dataset to use in production, you can meet quality issues. Even with simple tasks such as classification, the ratio of mislabeled annotations can be quite high, leading to poor performance for your trained model.

Thus I introduced to quality criteria for my annotation to track if the label is correct, and if the image has enough quality.

Create a Classification Dataset app with Django

To illustrate this, I have created a simple Django web app which can be used to host your Classification Dataset. To get it and populate it with the TF Flower Dataset :

Then you can start the django server and look into your annotations Database:

List of annotations in the Classification Database

By clicking on an annotation, you can see that each instance has 6 fields: image id, label, height, width, label correctness and lmage correctness. The last two fields refer to quality tags that you might want to add to your Annotations Database:

  • Label correctness: whether the annotation label is Ok, Ko or To Be Checked
  • Image correctness: whether the image from the Dataset is Ok, Ko or To Be Checked
Annotation as shown in the Django Admin site.

As you can see, the Admin site is pretty convenient if you need to modify a Database instance, but not very useful to have nice visuals or metrics about your DB.

Build a Streamlit Dashboard and connect it to your Django App

Here is the structure of the Streamlit app I built to monitor the annotation Database.

Structure of the Streamlit app to monitor your Database

As you can, it is very concise and structured in four parts:

  1. The title and page setup
  2. Accessing the data from the Database
  3. Displaying header Metrics
  4. Displaying quality Metrics

To calculate metrics and plots, you can write basic NumPy / pandas, and display them with Streamlit widgets, as you can see below:

Compute and show metrics

Finally, to access the annotations present in the Database, you can use Django ORM:

Get the annotations from the Database

However, if you want to run your Streamlit app, you will encounter the following issue...

Streamlit error when not setting up Django correctly

Indeed, we need to configure Django so that it can be run without a server.

Setup Django without running the server

To do so, we need to do 3 simple steps:

  1. Add the Django root directory into the PYTHONPATH,
  2. Set a Django Environment Variable to point to your Django settings file
  3. Run the django.setup() command

This is done in the following django_setup() function, which I located in utils.py.

Django setup

Then, you just need to run django_setup() BEFORE importing any Django modules in your Streamlit. All in all, the Streamlit app is as followed:

Streamlit app

Start the Streamlit app

Finally, you can start the app by running:

Then, you can access your Dashboard written in only a few lines of pure Python!

label correctness metrics
image correctness metrics

Wrapping up

We have seen that Django allows you to build Web app backend in pure Python but lacks of a built-in way to build Dashboards only in Python. However, you can couple it with Streamlit, which is the perfect tool for writing quick and pretty Dashboards in Python. To make it work, you only need to setup Django so that it runs without the server.

Are you looking for computer vision Experts? Don't hesitate to contact us!

Cet article a été écrit par

Laurent Montier

Laurent Montier