I am putting together a series for people who are excited to bring Azure into their software development life cycle and use Azure cloud’s extensive services to their full potential.
In this series, I will cover as below:
- Getting Started with Azure Development, Create App Service Plan and Publish MVC project using Visual Studio
- Deployment Slots and Slot Swap on Azure App Service using Visual Studio and Azure SDK
- Remote debugging App Service using visual Studio, monitoring and configuring alerts
- Diagnostic logs, live stream, process explorer and KUDU
- How to use Azure SQL Database in Dot.net Applications
- How to use Azure DocumentDB or Azure Cosmos DB in our Dot.net Applications
- How to use Visual Studio Team Service to do continuous Integration and continuous delivery
- Azure storage data services types and how to store files in azure storage account 1/2
- Azure storage data services types and how to store files in azure storage account 2/2
- How to use Azure Functions and trigger on new image/blob creation in Azure Storage using BlobTrigger 1/2
- How to use Azure Functions and trigger on new image/blob creation in Azure Storage using BlobTrigger 2/2
If you do not know where to start, please check my blog post, which covers detail about getting subscription and setting up. In this series, we assume that you already have active Azure subscription and Visual Studio 2013 or later installed on your system.
7. How to use Visual Studio Team Service to do continuous Integration and continuous delivery
In this post, we will be using Visual Studio Team Services as our source code management, if you do not know what the VSTS is, then a short description is that it is a free service which enable source code management, automate and simplify your azure deployment. It also support continuous integration and various tools such as Git, package management, TFVC, Reporting and testing. It requires you to have an account for VSTS, if you do not have, you can start free. Free version can be used up to 5 users, you can check your options at following link
Once you have the account setup, go to http://my.visualstudio.com/ and click on Get Started under Visual Studio Team Services. We will use VSTS to make our Build server and to configure continuous integration and continuous delivery, of course there are a lot of features in the VSTS but we will only focus on Git and continuous Integration and continuous delivery.
Figure 1 Get Started with Visual Studio Team Services
Microsoft will take you to landing page, here you can create an account if you have not created already and will list down your accounts, select an account to proceed.
Figure 2 Create Visual Studio Team Services Account
Once you go to the dashboard of the VSTS, click on create new Project, fill the form and click Create. Remember to choose Git as version control. If you are planning to use TFS as version control, it is totally possible and steps to enable continuous integration and delivery are the similar.
Figure 3 Create Project in VSTS
Once the project is created you will be presented with some useful information to get started,but in our case, since we already have a source code so we will use visual studio to upload our source code to this project.
Figure 4 Dashboard after new git project is created
Open up the visual studio and load your project if you have not opened it already. Now Go to Tools | Options | Source Control | and make sure that Git is selected in Current source control plug-in drop down. If you use TFS then make sure you have selected TFS while you created your project in VSTS as source control.
Figure 5 Select Git as plugin
We have opened the project and are ready to check in our source code. Now right click on Solution and click Add to Source control, or at the very bottom right of the visual studio click Add to Source control. You will see two options one is with Visual Studio Team services and other once is to connect with GitHub. Since we are using VSTS, click on connect under Visual Studio Team Services. In this process visual studio will create a master branch on local repository for you and also configure security and folders that needs to be uploaded and will also put rules to ignore folders like bin, debug and obj, plus it will ignore any user specific settings such is publishing profiles etc. Visual makes it easy to work with different source control providers and make it easy to handle security of your source code by excluding some files which are developer specific or machine specific.
Figure 6 Configure Visual Studio Team Services as source control
Now if you are not logged in, go ahead and login, choose the visual studio account | select project and click on connect and then click on clone, as you can see that it will clone the project from local repository to the online repository.
Now re-open the project and right click on solution and choose commit, enter a message and then choose Commit staged. Then click on sync to server option. You can also click on upward arrow button, which is at the very bottom and it will present the same window or you can click on team explorer to get to the same menu. Now click on Publish Git Repo.
Now select your account and then click advanced and select you team project and click Publish repository. Once your source code is published it is time to enable the continuous integration and continuous delivery in VSTS.
Figure 7 Publish code to the git repository
Go back to the dashboard of your project in VSTS, you will see now that it have changed the view and now showing, set up Build button, You can also access this Set up Build, by going to Build and Release tab and then click on setup a new definition.
Figure 8 Continuous Integration set up
Choose Azure Web App template under Featured tab, and click apply.
Figure 9 New Definition Azure Web App
Now choose your subscription and click authorize complete the process, choose app service name, choose hosted agent as hosted VS2017. Click on Get Sources under Process tab.
Figure 10 Configure build Process
You can see that is already selected the Repository and branch, you can change these settings if you want to configure any other source i.e. GitHub. Go through all other tabs just to see what is in there; you do not need to change anything. Keep in mind this will deploy to the main App Service, you can also change the settings to deploy it on any slot you have in the App Service.
Figure 11 Repository configuration
Now click on Triggers tab and check Enable continuous integration, this option will automate our build when you check in the code.
Figure 12 Enable continuous Integration
Save the settings and click on Queue, or click on Save & queue option. We will manually trigger the build process to see what is the process, and will also check in the code in visual studio to aromatically trigger the build which will deploy the source code to our App Service.
Figure 13 Queue the changes to App service.
Now click on builds and select your application, you will see that the Build is successfully deployed.
Figure 14 successfully deployed the build
Click on link under recently completed to see more information. Now it is time to test out continuous integration next.
Figure 15 recently run Build
Go to VS2017 | Views | Home | Index.cshtml and change it like below and right click on project solution and chose commit | choose commit all | sync | in outgoing commit click push
<div
class=”jumbotron”>
<h1>ASP.NET</h1>
<p
class=”lead”>@WebConfigurationManager.AppSettings[“WelcomeMsg”]</p>
<p
class=”lead”>We have implemented continuous integration.</p>
<p><a
href=”https://asp.net”
class=”btn btn-primary btn-lg”>Learn more »</a></p>
</div>
Figure 16 Commit Changes
Figure 17 sync the changes
Figure 18 Push changes for continuous Integration to trigger.
Once the push is clicked, you will see that a new build task is added in queue and is in progress.
Figure 19 New build job is in progress
Once the build is successful, refresh you site and you will find that new changes have been applied.
Figure 20 build successful
If you want to know what exactly was deployed you can actually see the files and can even download them as well, click on any of the build in above screen and the click on artifacts tabs and then explore the drop folder. In this folder you will find the zip file, which contains the files that were deployed to the App Service, you also have parameters and commands, it could be useful if in some case you need to replicate the things on local system, you just need to download the artifacts and configure them locally. Now let us see the result on actual site after our recent continuous integration deployment.
Figure 21 Artifacts Explorer
Before changes
Figure 22 before changes applied
After changes applied through continuous integration.
Figure 23 after changes applied through continuous integration
Remember that this was a build definition that we created there is another robust definition called release definition which have many scenarios that may suit your needs.
Figure 24 Release Definitions
Congratulations! You have successfully completed the full life cycle of Azure development, I hope it will help you in setting up development environment and carry on the Azure development. Please go through site you may find other series that may interest you. Good Luck!
coming up next Azure storage data services types and how to store files in azure storage account 1/2