Control Your Source Code With GIT And Azure DevOps

Click here to download the source code for this article or use your source code if you prefer.

This tutorial was split into 3 main topics so you can step from one topic to another.

In this article, in order to make it easier to understand some concepts, all important information will be highlighted and titled as "What is the catch?"

From this point on, it’s about 5 minutes reading and 10 minutes to apply this tutorial.

Tutorial’s overview

Each topic in this tutorial is separated in steps like #Step 01, #Step 02 and so on. Each sentence starts with a word in bold like Open, Click and so on.
For reference, all sentences contain keywords and hyperlinks for other articles in this Blog or other blogs.
At the end of each main topic, you will find my opinion about it.
The “What is the catch?” sentence is always highlighted like the example below:

What is the catch? You can download the source code used for that tutorial without reading anything. Just go to my GitHub and get it.

Prerequisites for this tutorial

Don’t worry if you have never used Azure DevOps before. I’ll try to explain every topic in this tutorial. For this tutorial, you will need to -

Install any version of Visual Studio 2017, even the Community version (it’s free). To install Visual Studio these days it’s such an easy job, different when I installed the first time.
You have to create a Microsoft account. If you already use any of Microsoft’s services like Skype, MSN, Live, Office 365, you will use that same credential.
To proceed, you have to create an Azure DevOps account and choose a subdomain for it, like mine fabiosilvalima.visualtudio.com account. Azure DevOps is free, create your account here.
Also, you have to check if the FSL.Framework.Core solution is on your computer and if it is compiling.

Uploading your Source Code in GIT of Azure DevOps

What are we going to do?

We’ll upload our FSL.Framework.Core source code to a GIT repository in Azure DevOps to manage branch versions and to control the developer updates.

So, let’s do it!

Step 01

Close the FSL.Framework.Core solution if you have it open.

Step 02

Create a new folder in any directory of your preference. For this article, I’ve created the folder in c:\inetpub\wwwroot\TFS\FabioSilvaLima\Tutorial2 directory.

What is the catch?

The folder I have created for GIT repository c:\inetpub\wwwroot\TFS\FabioSilvaLima\Tutorial2 cannot have any subfolders and files.

Step 03

Open Visual Studio and click on Team menu, then click Manage Connections option and last, click again on Manage Connections hyperlink.

Step 04

Click on Add TFS Server hyperlink and fill your Azure DevOps account data. Input your Microsoft credentials when requested.

Step 05

Choose, in the servers list, Tutorial 2 project and Tutorial 2 source code repository. Fill C:\inetpub\wwwroot\TFS\FabioSilvaLima\Tutorial2 for the path field and click Clone.

Step 06

Copy all the files and folders (except .git and .vs folders) from the project FSL.Framework.Core to the new folder C:\inetpub\wwwroot\TFS\FabioSilvaLima\Tutorial2.

Step 07

Click on Changes option in Visual Studio Team Explorer window.

Ignoring folders and files with the .gitignore configuration file

Step 08

Right-click on the folders below and choose the Ignore these local items option.

\.vs
\bin
\obj
\packages

We don’t need to version these files and folders when we update our project code in GIT. We only need to update text source code not DLLs or executables files.

What is the catch?

Files with .usr extension must be ignored as well because they contain the personal preferences of a developer. If you do version those files, you'll get a headache if you have more than one developer in your team. The GIT engine will warn you for any changes that .usr files has and your developers will always have to merge the source code.

Step 09

Write a comment and click on Commit Staged button, then write another comment and click on Commit All button.

Step 10

Click on Sync hyperlink and click on Push button to upload that commit in the Tutorial 2source code GIT repository in Azure DevOps.

Glossary

Manage Connections: Configuration and selection of source code in GitHub or Azure DevOps.

Team Explorer: Visual Studio window that has all features integrated with GIT engine.

Changes: It is a Team Explorer window option that shows us changes made to source code.

Commit: It is a Team Explorer window option to save source code changes to the local git repository. Commits are always local until you push them to the web server, in that case, Azure DevOps.

Push: It is a Team Explorer window option to send all commits from the developer’s machine to the Azure DevOps. Don’t forget to push all your commit at least once a day.

Branch: It’s a source code versioning. Each GIT repository starts with just one branch and the name is master. You can create other branches from master branch, renaming it as you wish.

What is the catch? All these options and buttons located at Team Explorer window are shortcuts for all GIT engines command-line functions. You can perform these actions by command line if you want to.

Visualizing the source code in Azure DevOps

Step 11

Open Azure DevOps website, navigate to the Tutorial 2 project and click on Repos tab and then Files option.

Step 12

Click on FSL.Framework.Core project in the list of projects and then click on the FSL.StringExtension.cs file. As you can see, it’s possible to make changes directly from Azure DevOpswithout using Visual Studio.

Switching from one branch to another in Azure DevOps

The master branch, by convention, it is a copy of the source code that is in the production environment. On real-world programming we shouldn’t develop using the master branch, we need to create another branch for it.

We have to create a development branch to understand how the merge between two branches works.

Step 13

Click on Repos and than click on Branches. From master branch, click on the three dots button and then click on New branch option.

Step 14

Enter the name tutorial2_novas_extensions_dev for the new branch and click on the Create Branch button.

Step 15

Open Visual Studio IDE and connect to the Tutorial 2 project in Team Explorer window and then click on Sync hyperlink.

Step 16

Click on Fetch hyperlink and then Pull hyperlink. That action will synchronize your local source code to the remote GIT repository and making the new branch tutorial2_novas_extensions_dev showing in local branches list in Visual Studio.

Step 17

Click on Home option from the Team Explorer window and then click on Branches option. After that, click on the plus icon to list all remote branches and double click on branch tutorial2_novas_extensions_dev.

Editing a development branch

Step 18

Include all source code below in the FSLStringExtension.cs file then commit the changes and push them to the Azure DevOps. Those changes will be available at the history tab, in Repos and Files of the Tutorial 2 project in Azure DevOps.

Merging branches

Step 19

Access the Repos tab and then click Pull Requests option from the Tutorial 2 project in Azure DevOps. Click on New Pull Request blue button located ai right size of the web page.

Assuming that you have done all the testing required, now would be the time do a Pull Request, so that someone on the team would review the code and merge it to the master branch.

Step 20

Choose branch tutorial2_novas_extensions_dev from origin and master branch for destination and click on Create button to create a Pull Request.

Step 21

Click on Complete button.

Step 22

Uncheck all checkboxes and click on Complete Merge button. That action will merge all updates from tutorial2_novas_extensions_dev to master branch.

Final comments

The main goal for this tutorial is to commit source code from a developer’s machine to the GIT source code repository in Azure DevOps.

I have also shown you some other features like creating branches and merging between branches.

I have named my branch tutorial2_novas_extensions_dev exclusively for this tutorial, but you can choose any name you want. Branch naming conventions is a discussion for another article.

Have you found some error? Did you like this article?

Please comment and share!

Thank you.