Implement A Continuous Integration Using GitHub Source In VSTS

Introduction

Visual Studio Team Service is a Microsoft product, which provides code management, project management, testing, continuous integration and many more functionalities. In this article, I am going to discuss about how to implement a continuous integration, using GitHub source in VSTS.

Consider a scenario, where your source code is in GitHub and you need to setup a continuous integration, using VSTS. The step by step instruction is given below on how to perform it.

1. Create a Service in VSTS.
2. Create a build definition with GitHub repository.
3. Create a Web app in Azure.
4. Create a release definition with continues deployment.

Before going through this article, I strongly recommend you read my previous article about continuous integration in VSTS.

Step 1 

Create a Service in VSTS

One of my GitHub repositories (https://github.com/gowthamece/CoreAppKendoDemos) consists of ASP.NET Core API Application, as shown below. 

I’m going to create a build definition for this repository from VSTS (Visual Studio Team Service).

CoreAppKendoDemos is the existing project in the Team Service with Git Version Control. I will use this repository to create a build defintion for ASP.NET CORE Application, which is located in our GitHub repository. 

Now, let’s create a new Endpoint Service, using this existing CoreAppKendoDemos project in VSTS; just go to Service of the project, as shown below. 

Project page in VSTS

Go to settings-> Serivce of the CoreAppKendoDemos.



 Click New Service Endpoint and select GitHub. 

 

The new GitHub Service Application Window will open, click Authorize and you will be redirected to Github page to complete an authorized process. 



 

Click Authorize Application to complete the authorization process.

 

Step 2

 

Create a build defintion

Select Build & Release -> Build from the menu. Click New Build definition.

 

A new create build definition window will be opened as shown in the below figure. 

A new create build definition Window will be opened with some list of predefined templates. Since we are working on an ASP.NET Core API site, I am going to select an Empty Template. Click Next to change the settings.

 

Click GitHub, check contious integration and click Create.



Give the repository type as GitHub and click Manage it. It will authorize you to access your GitHub repository from VSTS, once the authorization is done. Now, we need to add he task, which is used to build our Application.

Note- I have explained how to create a build definition for ASP.NET Core application in VSTS in my previous article. Please follow it becuase in this article, I am just skipping this step.

Step 3

Create a Web app in Azure for deployment

Log into your Azure portal. Quickly create a new Web app (New -> Web+Mobile -> Web app), as shown below.

To learn more about Azure app Services, click here.

 

 

Name the Web app, choose the respective settings and click Create. It will start the deployment process, once the deployment process is complete, create a staging slot from the deployment slot of the Web app, as shown below.

 

Proceed, as shown below.

 

http://github-ci-staging.azurewebsites.net is the URL generated from the deployment slot, which I am going to use in the release definition for the deployment 

Step 4

 

Create a release definition with continuous deployment 

Go to CoreAppKendoDemos Project page. Select Release from build & release menu. The release page will open, as shown below.


Click New definition.

The create release definition window will be opened with a list of deployment templates. Let's select Azure App Service Deployment and click Next. 

Choose the respective project and build the definition; followed by checking on continous deployment. Click Create to open the release definition page, as shown below.

 

 

 VSTS will bring your Azure subscriptions automatically, based on the login. We just need to select the respective subscription. Click Authorize and it will do an authorization process to get the app Service name.

 

We have created a deployment slot in our Azure Web App, so I am going to use it in the release definition. Based on our Azure subscription, it will list out our Web app and based on the selection of the Web app, it will display the slot. Finally, give the app Service URL and save the settings. 

Synchronize the code to perform continuous integration 

My ASP.NET Core API is capable of giving a technology list as a GET response, as shown below.

Local Response in POSTMAN 

 

Let's make some changes in the code and perform synchronization for GitHub from Visual Studio to check out our continous integration process.

 

 

Commit

 

Sync

 

Repository update in GitHub

Build definition status in VSTS 

 

Release definition status in VSTS

 

Our build and deployment is sucessful. Let's check the response in POSTMAN.

http://github-ci-staging.azurewebsites.net/api/Technologies/TechnologiesList

Summary

We have learned how to create a build and release definition with Azure app Service for the deployment in VSTS from the source ASP.NET Core Application in GitHub repository and implemented the continous integration.

I hope, you have enjoyed this article. Your valuable feedback, questions or comments about this article are always welcome.