Hands-On Lab
Getting Started with Git using Team
Foundation Server 2013
Lab version:
12.0.30723.00 Update 3
Last updated:
9/10/2014
CONTENTS
OVERVIEW ................................................................................................................................................... 3
EXERCISE 1: GETTING STARTED WITH GIT ........................................................................................... 4
EXERCISE 2: GIT BRANCHING AND MERGING..................................................................................... 22
Overview
In this lab, you’ll learn about Git support introduced in Team Foundation Server 2013 and Visual Studio
2013. Git is a distributed version control system. Git repositories can live locally (such as on a
developer’s machine) and can now be hosted by Team Foundation Server. You will learn how to
establish a local Git repository, which can easily be synchronized with a centralized Git repository in
Team Foundation Server. In addition, you will learn about Git branching and merging support.
Prerequisites
In order to complete this lab you will need the Visual Studio 2013 virtual machine provided by Microsoft.
For more information on acquiring and using this virtual machine, please see this blog post.
About the Fabrikam Fiber Scenario
This set of hands-on-labs uses a fictional company, Fabrikam Fiber, as a backdrop to the scenarios you
are learning about. Fabrikam Fiber provides cable television and related services to the United States.
They are growing rapidly and have embraced Windows Azure to scale their customer-facing web site
directly to end-users to allow them to self-service tickets and track technicians. They also use an onpremises ASP.NET MVC application for their customer service representatives to administer customer
orders.
In this set of hands-on labs, you will take part in a number of scenarios that involve the development
and testing team at Fabrikam Fiber. The team, which consists of 8-10 people, has decided to use Visual
Studio application lifecycle management tools to manage their source code, run their builds, test their
web sites, and plan and track the project.
Change log
For Update 3:

Now creating the new website using the ASP.NET Web Application wizard

Added note about CodeLens features for Git

Screenshot updates as necessary, other minor edits
Exercises
This hands-on lab includes the following exercises:
1. Getting Started with Git
2. Git Branching and Merging
Estimated time to complete this lab: 30 minutes.
Exercise 1: Getting Started with Git
In this exercise, you will learn how to create, clone, and push commits to a Git repository with Team
Foundation Server 2013.
1. Log in as Julia Ilyiana (VSALM\Julia). All user passwords are P2ssw0rd.
2. Launch Visual Studio 2013 from the taskbar and open Team Explorer. You should now be
connected to the FabrikamFiber team project. If you are not automatically connected to the
FabrikamFiber project, select the Connect to Team Projects button (
) to do so.
Figure 1
Connecting to Team Explorer - Home
3. There are a few reasons why Fabrikam Fiber might want to use Git as their source control
option within Team Foundation Server. One reason could be that they are collaborating with
developers using a tool such as Xcode, which supports the Git protocol natively. Another reason
could be that they have developers working offline (such as during a commute) who want to
commit code locally when they are offline and check this code into Team Foundation Server
when they get into the office. Microsoft now offers teams the ability to utilize Git without
sacrificing the integrated application lifecycle management capabilities offered by Team
Foundation Server. Visual Studio 2013 also provides developers with a great experience for
working with any Git repository – whether it’s hosted by Team Foundation Server, a local
repository, or another Git provider.
4. Select File | New | Team Project from the main menu.
5. Name the new project “FabrikamCommunity” and then select the Next button.
Figure 2
Creating new team project
6. Select the Next button to accept the default process template.
Figure 3
Creating new team project
7. Select the option labeled “Do not configure a SharePoint site at this time” and then select the
Next button.
Figure 4
Creating a new team project
8. Select the Git version control system and then select the Finish button.
Figure 5
Creating new team project backed by a Git repository
9. After the new Git team project has been created, select the Close button to return to Visual
Studio.
10. Select the Connect to Team Projects button.
Figure 6
Location of Connect button
11. Right-click on the FabrikamCommunity project node and then select the option to Clone.
Figure 7
Cloning the repository
12. Accept the default endpoint and repository location and then select the Clone button.
Figure 8
Clone repository to local folder
13. In Team Explorer – Home, select the Settings tile.
Figure 9
Project settings
14. Select the Git Settings link.
Figure 10
Git settings
15. Enter an email address for Julia (julia.ilyiana@vsalm) and then select the Update button.
Figure 11
Setting email address
16. Select the Home button in Team Explorer.
Figure 12
Navigating home
17. Create a new work item for the product backlog by selecting Team | New Work Item | Product
Backlog Item from the main menu.
18. Enter a title of “Create new web site” and then select the Save Work Item button. Take note of
the ID once the work item is saved.
Figure 13
Creating new Product Backlog Item
19. In Team Explorer – Home, select the New… link underneath the Solutions section.
Figure 14
Creating a new solution
20. In the New Project window, select the Visual C# | Web template node and then select the OK
button.
Figure 15
Creating new web site
21. Select the MVC template, de-select the option to “Host in the cloud”, and then select the OK
button.
Figure 16
Creating a new web site
22. In Team Explorer – Home, select the Changes tile.
Figure 17
Viewing changes
23. Scroll down the list of included changes to the end and note that .gitattributes and .gitignore
files were automatically added to the project. The .gitattributes file contains various settings to
control Git behavior whereas the .gitignore file specifies patterns and extensions to ignore
when detecting changes.
Figure 18
Included changes
24. Enter a commit message of “initial MVC site for work item #247”. If the Product Backlog Item
that you saved has a different ID, use that number instead. Typing ‘#’ followed by the work item
ID will automatically link the commit to the work item when pushed to the server.
Figure 19
Entering a commit message
25. Commit the changes by selecting the Commit button. Note that the commit is persisted locally
and is not shared with the server.
Figure 20
Committing changes locally
26. Let’s make a small change to the web site. In Solution Explorer, open the _Layout.cshtml file
from the Views | Shared folder.
Figure 21
Opening _Layout.cshtml
27. Modify the title as shown in the following screenshot (from “My ASP.NET Application” to
“Community”).
Figure 22
Modifying markup
28. In Team Explorer – Changes, enter a commit message and then select the Commit button. Save
changes to files when prompted.
Figure 23
Entering a commit message
29. Navigate to the commits view by selecting the Unsynced Commits link.
Figure 24
Navigating to commits view
30. The Team Explorer – Unsynced Commits view shows both incoming and outgoing commits.
Here we can see the two local commits that are ready to be pushed to the server.
Figure 25
Outgoing commits
31. Select the Sync button to perform both a pull and a push to ensure we have the latest source
before pushing our updates.
Figure 26
Synchronizing with the server
Figure 27
Synchronizing with the server
32. Finally, let’s take a quick peek at what these commits look like in the web portal. In Team
Explorer – Home, select the Web Portal link.
Figure 28
Launching web portal
33. Select the Code tab in the web portal.
Figure 29
Navigating to Code
34. Select the Commits tab to see the two commits. Note that the relative size of the commits (in
terms of number of modified files) can be determined by viewing the size of the circles
rendered to the left of the commits.
Figure 30
Commits view
Note: It may take a few moments after pushing a commit before the commit size indicators
show up. You can refresh the page if necessary.
35. Select the link associated with the first commit.
Figure 31
Selecting the first commit
36. Note that the “Create new web site” work item is linked to the commit. Select the link to open
the work item.
Note: It may take a few minutes before the work item gets linked to the commit. In the event
that the link has not been made yet, go ahead and continue on with the rest of the lab.
Figure 32
Viewing linked work item
Figure 33
Viewing linked work item
Exercise 2: Git Branching and Merging
In this exercise, you will learn about Git branching and merging support in Visual Studio 2013. In general,
branching is often used to help switch development contexts and to isolate risk. Git branching is no
different in that regard. Create a Git branch is a lightweight (and therefore fast) operation, as you are
simply creating a new reference to an existing commit. This is very different from Team Foundation
Version Control (TFVC) branching where the entire source tree needs to be duplicated server-side. We
will also take a quick look at the merging support for Git projects.
1. Return to Visual Studio and open Team Explorer – Home.
2. Select the Branches tile.
Figure 34
Branches tile
3. Let’s say that we would like to create a new branch to do some development work on the web
site. Select the New Branch dropdown, enter a name of “Development”, and then select the
Create Branch button. In this case, the new branch will be based off the master branch.
Figure 35
Creating new branch
4. Note that the new branch was created locally and has not been published to the server. You can
create as many branches as you want locally, and you do not have to be online with TFS in order
to do this.
Figure 36
New local branch
5. In Solution Explorer, open the HomeController.cs file from the Controllers folder (if not already
open).
6. Modify the About method as shown in the following screenshot.
Note: Update 3 now provides CodeLens support for Git repositories. This provides author,
change and work item indicators that work very similarly to their Team Foundation Version
Control counterparts. Unlike the CodeLens support for TFVC, CodeLens for Git is computed
solely on the client side. This means that you can use the feature for any Git repository,
whether it is local, cloned from TFS Git, for even cloned from GitHub or another Git source.
Figure 37
Modifying source code from new branch
7. Select the Changes link in Team Explorer - Branches.
Figure 38
Changes link from the Team Explorer - Branches view
8. Enter a commit message of “dev version” and then select the Commit button. Save changes
when prompted.
Figure 39
Commit changes
9. At this point, the changes have been committed locally. In the Team Explorer – Changes
window, select the Branch dropdown and then select the master branch.
Figure 40
Switching between branches
10. After switching to the master branch, note that original version of the HomeController.cs file is
automatically shown in the code editor window.
Figure 41
Switching between branches
11. You don’t have to publish the branch to the server yet if you want to continue working locally.
As you saw in the previous exercise, you can continue to work locally and add additional
commits to the new branch. In Team Explorer – Branches, right-click on the Development
branch and select View History.
Figure 42
Viewing history for local branch
Figure 43
Source history for selected branch
12. When you are ready, you can delete the branch, merge it back into your master branch, or push
it to the server-side repository so that teammates can access it. Let’s go ahead and publish the
branch by right-clicking the Development branch and selecting the Publish Branch option.
Figure 44
Publishing branch
Figure 45
Successful publication
13. You can easily switch between branches by double-clicking on the branch nodes in Team
Explorer – Branches. Go ahead and switch back to the Development branch (double-click on
branch).
Figure 46
Switching between branches
14. Now let’s say that another team member makes a modification to the HomeController.cs file
and commits that change to the master branch, before Julia has a chance to merge in her
development changes.
15. Switch users and log in as Adam Barr (VSALM\Adam). All user passwords are P2ssw0rd.
16. Launch Visual Studio 2013 from the taskbar.
17. Select the Connect to Team Projects button from Team Explorer – Home.
Figure 47
Connect to team project
18. Select the Select Team Projects… link.
Figure 48
Connect to team project
19. Select the FabrikamCommunity team project and then select the Connect button.
Figure 49
Connect to team project
20. Double-click on the FabrikamCommunity project shown in Team Explorer - Connect. Note that
the Git project has a special icon.
Figure 50
Connect to team project
21. Clone the repository using default options as you did in the first exercise.
22. Open the Git Settings from Team Explorer – Settings as you did in the first exercise and add an
email address for Adam. The email address that you use does not matter for the purposes of
this demonstration.
Figure 51
Setting up Git email
23. Double-click on the MvcApplication1.sln solution shown in Team Explorer – Home.
Figure 52
Open solution
24. Modify the same HomeController.cs file that Julia did, but this time change the text to be
something different.
Figure 53
Modifying web page title
25. In Team Explorer – Changes, enter a commit message of “Adam’s version” and then select the
Commit button. Save changes when prompted. Note that Adam has committed changes to the
master branch.
Figure 54
Commit changes
26. Select the Sync link.
Figure 55
Sync changes with server
27. Select the Sync button.
Figure 56
Sync button
28. Switch users once again to log in as Julia.
29. From Julia’s perspective, she has so far created a local branch based off the master, made a
change to a file, and then published that branch. Julia would like to go ahead and merge her
Development branch back into the master branch.
30. In Team Explorer – Branches, select the Merge dropdown.
Figure 57
Merging Git branches
31. Select Development as the source and Master as the target. Select the Merge button to start
the merge process.
Figure 58
Merging Git branches
32. Note that the Master repository is currently selected and that HomeController.cs shows the
development version of the text. The merge was performed locally by updating the Master
branch to point to the latest commit of the Development branch.
Figure 59
Merge completed locally
33. Right-click on the Master branch in Team Explorer – Branches and select the View History…
option. The history view should look identical to the one you saw earlier, except this time both
the Development and Master branch designators (in red) point to the same commit.
Figure 60
Merge completed locally
34. Still unaware of Adam’s change that he pushed to the Main branch earlier, Julia will now
attempt to push her commit. Select the Unsynced Commits link.
Figure 61
Navigating to Unsynced Commits view
35. Select the Sync button to attempt a pull and a push with the server.
Figure 62
Synchronizing with server repository
36. Visual Studio reports that we can’t push our commit yet due to a conflict.
Figure 63
Conflict between two different commits
37. Select the Resolve the Conflicts link.
Figure 64
Resolving conflicts
38. In the Team Explorer – Resolve Conflicts view, select the HomeController.cs file listed under
the Conflicts section.
Figure 65
Resolving conflicts
39. Select the Merge button.
Figure 66
Starting manual merge process
40. The Merge window used for Git conflict resolution is very similar to the one used with Team
Foundation Version Control. We will go ahead and assume that Julia’s change is correct, so
check the box shown in the top-right pane.
Figure 67
Merge window
41. Select the Accept Merge button.
Figure 68
Merge window
42. Select the Commit Merge button.
Figure 69
Commit the resolved merge
43. In the Team Explorer – Changes view, note that conflicts have been resolved but the merge still
needs to be committed. Enter a message and then select the Commit button. Save changes
when prompted.
Figure 70
Commit the resolved merge
44. Select the Unsynced Commits link.
Figure 71
Unsynced Commits
45. Select the Sync button to finish the merge process.
Figure 72
Syncing with server
46. Select the Web Portal link in Team Explorer – Home.
Figure 73
Opening the Fabrikam Fiber web portal
47. Select the Code tab.
Figure 74
Navigating to Code view
48. Select the Commits tab to view all commits pushed to the repository.
Figure 75
Commits view
49. Select the Branches tab to view all branches published to the repository.
Figure 76
Branches view
50. Finally, let’s take a quick peek at managing security and permissions for Git repositories hosted
in Team Foundation Server. Select the FabrikamCommunity dropdown and then select the
Manage Repositories link.
Figure 77
Managing repositories
51. The first thing to note is that you can create additional Git repositories within the same team
project.
Figure 78
Option to create additional Git repositories
52. Select the FabrikamCommunity repository node.
Figure 79
Navigating to repository node
53. You can manage repository level security here for your users and security groups.
Figure 80
Managing repository security
54. Select the Master branch node. Security level settings that affect only the currently selected
branch can be made here, providing fine-grained control for your repository if needed.
Figure 81
Managing branch security
To give feedback please write to [email protected]
Copyright © 2017 by Microsoft Corporation. All rights reserved.