All of my day-to-day projects are using Team Foundation Version Control (TFVC) repositories, but recently we have been considering using Git. This is for a few reasons, but one of the big ones is the rich functionality that is provided in Visual Studio Code. Whilst at Ignite I mentioned this to one of the VSTS team and was hit with a very passionate response saying that we should take the time to try it out.
What you’ll need
- Git for Windows
- Visual Studio Code
- The Team Services extension for VS Code
- A VSTS project with a Git repository
Step 1: Clone the repo to your computer
In Visual Studio Team Services, navigate to the Code > Files section of your project.
You should see something like below, which is my simple Git repository, complete with just a readme file.
If you look to the right of the Files you will come across a Clone button, click it and copy the Clone URL.
Now open a command prompt and navigate to the folder you would like to put your cloned repo. Then run git clone
You may be asked to authenticate with Team Services, but after you should see something like this…
Nice work! This has put in a folder of the same name as your repo in the folder you ran the clone.
Now it’s time to get into the IDE.
Step 2: Open the folder in VS Code
In VS Code, click on the Explorer tab (the top one – looks like some files) and then click Open Folder. Select and open the folder of the repo we just cloned. This will populate the explorer with the structure of the repo. In my case, it’s just the Readme file.
The third tab is your Git tab, allowing you the ability to commit, pull, and sync your repos. It also shows you what has changed and is yet to be committed. This all becomes active when you load a folder that is a Git repository.
You should get a message from the Team Services Extension that you are not logged-in to Team Services, let’s rectify that.
Step 3: Login to VSTS from VS Code
The Team Services extension in VS Code only allows you to authenticate with VSTS with a Personal access token (PAN), so we will have to grab one of those first.
Back in VSTS, navigate back to Code > Files and click on that Clone button. Click on that blue Generate Git credentials button and then Create a Personal access token.
Whilst making the token, you must have the Build (read), Code (read), and Work items (read) scopes selected. Generate the token and you will be presented with the token value. It is important you copy this token for the next step as you only have one chance of getting it.
Head back to VS Code, and bring up the Command Pallette (Ctrl-Shift-P for the Windows folk), then type team login.
You will be prompted to enter in your access token, do so. This should be all you need to connect VS Code to VSTS. At the bottom of VS Code, you should see some cool info about your project.
Clicking on the first part allows you to switch between branches, and refresh any branch, which I think is pretty freaking awesome. You can also see any pull requests, work items, and other stuff.
Where to from here
The VSTS extension for VS Code has plenty more options to it, and I recommend you have a look at the documentation.