Part-3: Streamlit Dashboard Deployment

This is the third and final post of the series on how we developed interactive dashboards at Factly using Streamlit. Please read through the first two parts if you haven’t already and if you are interested in learning how to build dashboards using Streamlit with a hands-on, step-by-step tutorial to build one of our dashboards on the UNESCO World Heritage Sites:

• PART 1: Getting Started with Streamlit — Building your First Dashboard Page
• PART 2: Adding Aesthetics and more Interactivity to Streamlit Dashboards

There are various ways to deploy a simple Streamlit dashboard and none is more straightforward than publishing it through Streamlit Cloud. For most hobby projects and projects where users would not mind keeping the code open source, deploying Streamlit Cloud is the way to go. You can find the steps to deploy on Streamlit Cloud here.

There are also various other ways to deploy Streamlit applications across platforms. This is a good guide that I recommend checking out if you are planning to deploy Streamlit applications on other platforms.

At Factly, we plan to deploy tens of public dashboards in the coming months, and we manage all our Streamlit applications as a Monorepo to keep the management simple. We also deploy all our applications at Factly on Kubernetes, so we decided to deploy our Streamlit applications on Kubernetes as well to keep it consistent. We plan to move to deploy the dashboards on Cloud Run later. But for now, let’s discuss the steps we follow to deploy our dashboards on Kubernetes.

At Factly, we create the initial dashboard project with a template built using Cookiecutter. The project created using Cookiecutter creates all the Kubernetes artifacts that are applied to the Kubernetes cluster using the CI/CD pipelines built on Github Actions for CI & Argo CD.

Following are the steps to describe Factly’s deployment steps at a higher level:

• GitHub Action builds Docker Images for all the dashboards in the Monorepo that are modified and pushes the images to the Container Registry.
• ArgoCD deploys all the modified dashboards to Kubernetes environment and updates the DNS changes to Cloudflare accordingly.

GitHub Actions & ArgoCD setup might be an overkill for this blog post, but let us look at the Kubernetes manifests that we use to deploy the Streamlit dashboards.

Structure for existing streamlit dashboard :

1. main.py: This becomes the entry point to run the Streamlit dashboard.
2. requirements.txt: All the Python dependencies for the current project are kept in this file
3. All other python scripts: All other scripts that constitute helper functions and different pages of the Streamlit dashboard
4. static: All the other static files like logo etc. are stored inside this folder
5. Dockerfile: Dockerfile consists of sequence of instruction to build an image
6. Deployments: In our case, we would create a folder called k8s , which would consist of all the required yaml manifest files that help us in deploying our dashboard

Dockerizing the Streamlit dashboard::

1. Dockerfile with all instructions to create an image for the current project:

2. Following is the meaning of every step in the Dockerfile:

a. FROM python:3.8-slim-buster : Python with version 3.8 with an underlying operating system of Debian 10 and slim represent paired down version of the complete package with only minimal installs. This is used to keep the image base size as small as possible.

b. EXPOSE 8501 : Streamlit by default occupies the port 8501 if nothing is mentioned , Thus we expose the port 8501 to localhost.

c. Change the working directory inside the docker container to app and copy paste all the static folder inside the app directory

d. Copy the requirements.txt file from the local inside the docker container and run command will install all the dependencies

e. COPY . . will add all the required scripts to the app folder.

f. CMD streamlit run main.py will run the command streamlit run main.py inside the container shell.

3. Saving the docker image :

a. You must have a docker-hub account to push and image to registry.

b. To save the current Streamlit application as a docker image, run the following command:

This will build a docker image using the Dockerfile that is present inside the current directory. There are 2 tags with which we build an image , 0.0.1 and latest.

c. To push an image to docker registry :

Deployment Step-by-Step:

Lets look at the four manifests that are to be deployed in Kubernetes to publish a Streamlit Dashboard:

1. deployment.yml

• This yaml script will define deployment object with name world-heritage-sites
• This deployment object will depend on the docker image <username>/db-world-heritage-sites:latest that was created and pushed to the container registry
• Environment variable that are used by the scripts can also be passed along with this script with spec.containers.env as key value pairs
• We expose the port 8501 , similarly like we expose the port 8501 inside the docker container
• The specifications for the resources required like memory, CPU and their limits could be specified with spec.resources

2. service.yml

• Service abstractions consists set of policy and rules to make connection with the pod named world-heritage-sites
• This specification creates a new service object world-heritage-sites with Target TCP port 8501 on any port with name world-heitage-sites

3. ingress.yml

• This abstraction is responsible to expose HTTP and HTTPS routes outside the cluster to services within the cluster
• Rules are present to route the path accordingly to the provided service name. In the above case any outside route to db-world-heritage-sites.factly.in or www.db-world-heritage-sites.factly.in will be redirected to the service name world-heritage-sites via the ingress load-balancer.

4. certificate.yml

• Issues a free SSL certificate from Let’s Encrypt that renews automatically every 90 days.

This is the third & final one of the series on building interactive dashboards at Factly. You can read Part-1 & Part-2 below.

• PART 1: Getting Started with Streamlit — Building your First Dashboard Page
• PART 2: Adding Aesthetics and more Interactivity to Streamlit Dashboards