Understanding and setting up CI-CD of Python web app through VSTS on Azure (#2 of 5)

Welcome to 5 Part blog Series that covers Azure DevOps, this is 2nd part.

Part 1 - Introduction of Azure DevOps and Basic terminologies.

Part 2 - Understanding and setting up CI/CD for Python App on Azure

Part 3 - Setting up CI / CD of .NET Core running on Linux  on Azure

Part 4 - Setting  up CI / CD of .NET application using Azure App Service.

Part 5 - Setting up CI / CD of Node.js application using Azure App Service.

Continuous integration and continuous deployment has become one of the most common use cases of Microservices early adopters. CI/CD merges development with testing, allowing developers to build code collaboratively, submit it the master branch, and checked for issues. This allows developers to not only build their code, but also test their code in any environment type and as often as possible to catch bugs early in the applications development lifecycle.
Here we will be setting up CI / CD through VSTS on Azure and will understand various options and features that VSTS offers.
Step1 . login into Azure Portal and click on create a resource and Select DevOps Project.

Step 2 . Now Select Python Application Type and click Next.

Step 3.  Now we will select Django as Python Framework and click next

Step 4. I want to deploy my app on Containers on Azure so select Web App for Containers and click next.

Step 5. Here we will create a new VSTS code Repository , you can also link existing VSTS account , enter PythonDjangoApp as the project name , select Azure Subscription give the name of Web app and select location of Web App and click Done as shown below.


Step 6 After some time you can see following Azure Resources in your Azure Subscription.


Step 7 Now I am opening my newly created VSTS account  mycoderepoonvsts.visualstudio.com

7-LoginIntoVSTS Account.PNG

Step 8 . Not  only this also open your newly created Web app that is running on Azure Containers , in this case my python Django web app is running on this URL https://pythondjangoapp.azurewebsites.net

8- OpenPythonWebApp.PNG

Step 9. From step 7 above click on “Work” section and let me create a task for me to update the Heading of this newly created Website. After clicking on “Work” I am landed to this page and I have to create “New Work item” as shown below.


Step 10. Enter task details as shown below and click on save and then click on Code->Files Menu at the left


Step 11.  Now Udpate the code as shown below open index.html file under app/templates folder , click on edit icon on the right file is editable now , update the line no 17  as shown below and click on commit while committing select work items as the one you created earlier.



Step 12 . Since our CI process is already in place , now click on Builds menu from the left and you can see that a new build is triggered for this change as shown below.


Step 13: Click on the highlighted build no. as shown in above image and you can see all the step performed by CI pipeline as shown below, you can see that build is completed successfully.


Step  14 : Now go to Release menu from left and you can see a new Release is triggered as shown below and now click on Release-2 hyperlink.


Step 15 : Here you can see that a CD is in Progress.


And after few seconds release gets completed.


Step 16 :Now lets open the Python Web App again and see that the app is updated.


Step 17: Do not forget to mark your task as done and close it.

In Next Blog Post we will be setting up CI CD pipelines for a .NET Core Web app running on Azure.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.