Alessandro Del Sole's Blog

/* A programming space about Microsoft® .NET® */
posts - 159, comments - 0, trackbacks - 0

My Links

News

Your host

This is me! This space is about Microsoft® .NET® and Microsoft® Visual Basic development. Enjoy! :-)

These postings are provided 'AS IS' for entertainment purposes only with absolutely no warranty expressed or implied and confer no rights.

Microsoft MVP

My MVP Profile

I'm a VB!

Watch my interview in Seattle

My new book on VB 2015!

Pre-order VB 2015 Unleashed Pre-order my new book "Visual Basic 2015 Unleashed". Click for more info!

My new book on LightSwitch!

Visual Studio LightSwitch Unleashed My book "Visual Studio LightSwitch Unleashed" is available. Click the cover!

Your visits

Follow me on Twitter!

CodePlex download Download my open-source projects from CodePlex!

Article Categories

Archives

Post Categories

.NET Framework

Blogroll

Help Authoring

Microsoft & MSDN

Setup & Deployment

Visual Basic 2005/2008/2010

Visual Studio Code: version control with Visual Studio Team Services (Windows and Mac)

As you know, Visual Studio Code is extremely useful and versatile. It is a cross-platform development tool that I've personally described with my ebook Visual Studio Code Succinctly.

Among its various characteristics that make it a development tool rather than a mere editor, there is the native integration with Git, the popular version control engine which is also open source and cross-platform. In the ebook I explain how to integrate Code with GitHub, in this post I will explain how to integrate Visual Studio Code with Git repositories on Visual Studio Team Services, with Windows and Mac. Of course everything I'll describe applies to Linux as well.

Prerequisites
You need a few prerequisites:
  • Visual Studio Code
  • A Visual Studio Team Services account. Remember you can get one for free, up to 5 members in the team
  • Git.You should already have it if you installed  Visual Studio 2015. On Mac, you should already have it if you installed XCode. If not, follow the instructions in the download page for all the supported operating systems
  • .NET Core and the CLI.
Objectives
We'll reach two objectives: the first is adding a .NET Core project to an online repository, while the second one is cloning an existing VSTS repository.

Creating a repository with Visual Studio Team Services

I assume that you have created your account and you entered the website, normally available at username.visualstudio.com. In the home page you will find a link to create a new Team Project, just as you would for the TFS engine. When ready, type a name for the team project, an optional description and make sure Git is selected as the source control engine




After clicking Create project, you will see a welcome page. Click on Add some code at this point. You will be offered an option to clone the repository by using Visual Studio, but we don't care. You will be provided the URL of the repository, and you will need to specify the credentials associated with Git. The URL of the repository will be used in a little while, so copy it somewhere or in memory. Although you can specify a user name and password, it is best to generate a token. This will be useful later in Visual Studio Code. That said, click on Create a personal access token (if you have one already, you can skip this step):




In the token creation page you will need to specify a friendly name, expiration and the associated account. The latter is necessary because your email address may be associated with more than one account on VSTS. Choose the account where you set up the Git repository. When you create the token, make sure you have selected the permissions as shown in the following figure:



It is worth noting the Work items permission: this will make you understand that you have an option to manage work items such a pull requests. After clicking Create Token, the token will be shown and can be copied. Important: copy the token in a secure place and keep it safe; do not lose it because this is the only time you will see it. It will be used in a couple minutes.

Creating a sample project

The configuration of the Git repository with VS Code is the same with any folder Code itself can handle, but for the sake of convenience we'll see the steps with a .NET Core project. Open a command prompt inside the folder in which you want to create the project, then type the following line:

> dotnet new -t web

This will create a new ASP.NET Core project in C#. Next, open the newly created project with Visual Studio Code. At startup, it will require your permission to create some missing assets and to restore missing NuGet packages. Of course, give your permission to both.

Configuring Visual Studio Code

The steps I'm going to describe are the same on Mac and Linux, I'm using Windows in this case. In order to make Code able to connect with Visual Studio Team Services, you must install the same-named free extension provided by Microsoft:



In my case the extension is already installed, this is why the Install button is disabled. Once installed and Code ha restarted, click the Git icon from the panel at the left, then click Initialize Git repository. This is a mandatory step, because Git first works with a local repository and then with a remote one. At this point, perform a local commit:



Now that you have configured a local repository and that the project is associated to it, it is also necessary to associate the remote repository. Open a command prompt on the folder that contains the project and type the following:

> git remote add origin https://accountname.visualstudio.com/_git/repositoryname
> git push -u origin master

In the first line, of couse replace accountname with your actual account name and repositoryname with the name of your repository. The second line pushes the source code to the master branch of the local repository, and finalizes the association between the project and the remote repository.

Go back to Visual Studio Code. What you should do now is to map the environment with the remote repository. Actually it is easily done. You have two alternatives: click the Team icon in the status bar at the bottom left, or type Team login in the Command Palette. In the first case you will see this error:



If you click Close, you will be required to enter the token you created previously within Visual Studio Team Services:



At this point you will be authenticated and Visual Studio Code will automatically recognize that the local repository has a related remote repository, as demonstrated in the status bar where you can see the name of the repository, plus a number of icons that you can use to manage branches and pull requests (I won't cover this in this post):



You will see a sync button near the name of the current branch. Before syncing, you need to perform a commit because the association of the remote repository has caused Code to generate a couple of additional files. Once committed, click the Sync icon. After a few seconds you should be able to see your code in the Visual Studio Team Services portal:



Now you are ready to work in team on the project. Obviously, other people working on the project must clone the repository. This is described in the next section and applies to both existing and new repositories.

Cloning the repository (Mac edition)

I'll be describing how to clone a remote Git repository from Visual Studio Team Services to Visual Studio Code using a Mac. This is identical on Windows and Linux too. On the Mac, create a new folder where you will want to clone the repository and open an instance of the Terminal on that folder. Then type the following line:

> git clone https://accountname.visualstudio.com/_git/repositoryname

replacing the account name and repository name. After a few seconds you will be required to enter your email address and password. The email address must be the same you used to create the remote repository. You might also want to consider Git credential managers (some are listed in the VSTS page for the repository). The password is instead the token created before. Note: Mac OS does not show any masked character when you type the password and you will see nothing: no worries, paste the token and press Enter:



Once the process is completed, you will be able to open the project in Visual Studio Code, which of course implies installing the Visual Studio Team Services extension and signing in with the token:



Commits you make will be sync'ed with the remote repository and other team members will be able to work on the project by simply clicking the sync icon.

Visual Studio Team Services is very powerful with all the advantages of the Cloud, so combining it with Visual Studio Code makes this even more appealing.

Alessandro

Print | posted on giovedì 27 ottobre 2016 00:00 | Filed Under [ Visual Studio 2015 ]

Feedback

No comments posted yet.

Post Comment

Title  
Name  
Email
Url
Comment   
Please add 8 and 4 and type the answer here:

Powered by:
Powered By Subtext Powered By ASP.NET