Deploy Python Dash application on Azure Cloud Web App for Windows

We are going to deploy locally hosted python dash application on Azure web on windows and docker container. Here, in this post i have used a sample dash application common and available to use from dash website, however, this can easily be scaled to any complicated application and easily customizable.

Azure App Deployment

Table of Contents:

1. Prerequisites
2. Host small python application locally
3. Creating copy of local virtual environment on docker
4. Push contents through docker for deployment
5. Enable/Start Azure webapp to use updated docker contents

1. Prerequisites

Before we start we have to take care of some prerequisites in order to develop and deploy the solution successfully and they are as follows:
a. Docker latest version installed
b. Git CMD
c. Python 3.8+
d. Azure subscription

2. Host small python application locally

As we need to prepare our python application locally before we deploy on azure so we will create a working directory in the suitable location on C Drive. Now within this particular location, we are going to install virtual environment and activate it for our usage. Please find below the steps to be followed for this (It needs to be performed post working directory is set):

-> pip3 install -U pip virtualenv
-> virtualenv — system-site-packages -p python ./venv
-> \venv\Scripts\activate

Now it should start virtual environment for you. Once venv is started run following steps to setup the folder:
a. mkdir dash-azure && cd .
b. create two blank files for our codes, application.py and Dockerfile:
touch application.py
touch Dockerfile

Once this files are initiated, let’s run through some installations which will become our dependencies for this app and be part of requirement files:

pip install dash — upgrade

As its a small application what we are trying to build here, we have very few standards requirements so we will freeze all these into requirements.txt

pip freeze > requirements.txt

In this step we will setup our application code which we initiated and it should look like below:

import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash()
application = app.server

app.layout = html.Div(children=[
html.H1(children=’Hello Dash’),

html.Div(children=’’’
This is Dash running on Azure App Service.‘’’),

dcc.Graph(
id=’example-graph’,
figure={
‘data’: [
{‘x’: [1, 2, 3], ‘y’: [4, 1, 2], ‘type’: ‘bar’, ‘name’: ‘SF’},
{‘x’: [1, 2, 3], ‘y’: [2, 4, 5], ‘type’: ‘bar’, ‘name’: ‘USA’},
],
‘layout’: {
‘title’: ‘Dash Data Visualization’
}
}
)
if __name__ == ‘__main__’:
application.run(debug=True, host=’0.0.0.0', port=’3000')

Please note we are launching app on specific port which is 3000 and it is most crucial step for deployment, without this some users may face issues connecting when we launch it in Azure because of port 80 access restrictions. However, if you have no constraints, feel free to use any port you would like.

To check if python code is working and dash is hosted properly or not, let’s run a query and analyze it:
python application.py
This should give you a URL (http://127.0.0.1:3000) to access the running application and it can be validated if you are able to access locally hosted app.

3. Creating copy of local virtual environment on docker

As we have tested and application is running locally, in this step we are going to create image on docker, i hope docker is already started and running in the background. If not, docker can be installed from https://www.docker.com/products/docker-desktop
Note: You need to create an account on docker, so let’s create an account and sign in already before we setup.

Let’s first update docker file we had created few steps earlier and paste these codes as below:
Dockerfile

FROM python:3.8-slim

EXPOSE 3000

RUN mkdir /app
WORKDIR /app
ADD requirements.txt /app/
RUN pip install -r requirements.txt
ADD . /app/

ENTRYPOINT [ “python” ]
CMD [“application.py”]

Once file is updated and saved let’s run following steps to build our codes image on docker.

docker build -t dash-azure .
docker run -it — rm -p 3000 dash-azure

You can check this app running on 127.0.0.1:3000 on windows and 0.0.0.0:3000 on mac

After successful validation, we will publish all these changes to our docker in simple 3 lines and enable our container to contain all the latest codes and requirements for deployment.

4.Push contents through docker for deployment

Let’s login into docker and push the changes to the image as mentioned below, please note user name is the username you would have got while creating id on docker app:

docker login

docker tag dash-azure (docker username)/dash-azure:1.0.0

docker push username/dash-azure:1.0.0

Once these steps are successfully completed, our application has been copied properly to docker and ready for deployment through any cloud portal supporting docker image.

5. Enable/Start Azure webapp to use updated docker contents

As we have been working for azure web app, so we will focus on Azure cloud today. Let’s login to cloud and launch a new web app service as shown below:

Webapp create page

Select subscription of your choice and resource group, we can name our web app anything as we like but needs to be unique as per Azure.

Choose Linux as OS and proceed to next page for docker setting. From the publish option, let’s choose Docker container and go to next page:

Docker configuration

From this page, we need to choose Docker Hub as our source of image from Single container option.

Post Selecting Docker hub, we need to put our image and tag name, as done in this example.

Now, let’s hit create app and wait for this app to be deployed on Azure.

Once app is deployed, one can try accessing it using public URL. However, some users may face issues and app may not start on time because we need to update some default settings in order to bypass some network challenges.

To do that , if you recall we setup port 3000 as part of our application and docker so that we can access the same on this port when we launch from azure. So to enable this, we need to add few settings into app configuration page as mentioned below:
Use EXPOSE and put value 3000 in the docker file post connecting to python

Use WEBSITES_PORT app settings with value of 3000 to expose to that port

Use WEBSITES_CONTAINER_START_TIME_LIMIT and increase value to 400

Save the settings and re-push the image to docker and restart the application and the web app will be back again as it was running locally. For logs please check container logs from application.

Once above steps are complete and application has been restarted, try launching the application again with public URL and Hurrah!! your application is ready.

I hope this information was useful!! and you were able to deploy the application as per your requirement.

Please drop me a note in case of any feedback or any questions.

Ajeet Kumar
Data Scientist

Linkedin

The opinions expressed herein are my own and do not represent those of my employer or any other third-party views in any way.