Working with remotes in Git, GitHub and Visual Studio

In previous post, we discussed about how to work with remotes in Git at command line. In this post, we are going to discuss how we can do the same from the very comforts of Visual Studio while we continue to host our source code on the GitHub. While it’s true that there is no command or built-in option available in Visual Studio to connect to GitHub, we can leverage one of the extensions available for GitHub.

Install GitHub Extension for Visual Studio

To search for this extension, let’s open Visual Studio first. From the tool bar menu, select Tools and then click on the ‘Extensions and Updates’:

Go to tools and then extensions and updates

From the left pane shown, click on the Online and then search for github from the right pane. This would prompt Visual Studio to search for relevant results from the marketplace and a list would be generated in the center pane. Out of the results shown, find the one named as ‘GitHub Extension for Visual Studio’ and then click on the download button just next to it:

Search for GitHub extension and click Download

This would take few minutes to download. To start with the installation process, we need to close Visual Studio and then follow the wizard.

Setup integration between Visual Studio and GitHub

For Visual Studio to be able to connect to GitHub, we need to provide it sign-in information. Go to Visual Studio -> Team Explorer and then click on the settings option. If you are not working on a solution inside Visual Studio, you will get the option of only Global Settings. If there is an existing solution already opened in Visual Studio, then you would get to see both Global Settings and Repository Settings:

Settings option in the visual studio

The global settings would define the machine-wide settings for your user profile which then would be applicable to all git repositories. However, repository settings are scoped to only one git repository in reference. Let’s open Repository Settings, provide the username and email which match with our GitHub account and click Update:

provide username and email settings for authentication

Next, go to Home in Team Explorer, Manage Connections and then click on the sign-in next to GitHub:

click on sign-in for github authentication

It will prompt a window for you to sign-in to GitHub. Provide appropriate information and it will save the same.

Publish Source Code to GitHub

From the Team Explorer, go to Home and then go to Sync. In the menu shown, select ‘Publish to Github’:

select publish to github from list of publish options

I’ll use default settings in my case but you can change it as per your needs. After this, click Publish, which creates repository in GitHub, add remote to local repository and Push:

provide publish settings

If everything goes fine, we should see a success message along with the url for the github repo inside visual studio itself:

repository publish message inside visual studio

At this point, we can either copy paste the link in the browser or just click it, which will open it in a browser and we should be able to see our code inside GitHub:

viewing source code repository in github

We can navigate around our code in the repository to verify that upload was successful. By default, it will sync only master branch. We’ll need to publish other branches, as and when we need the same.

Fetch Source code from GitHub

Let’s modify some files in the source code in the GitHub hosted code and then commit the same:

commit code changes in the github hosted code

To fetch above change, go to Home icon in the Team Explorer, then click on Sync and then select Fetch followed by Pull:

Pull changes from the github

Push Source code to GitHub

Let’s modify some code in the local repository inside Visual Studio and then commit the same:

commit changes in the local code

To push above change, go to Home icon in the Team Explorer, then click on Sync and then select Push:

push changes to the github repo

Alternatively, you can also select to do Sync, which will first perform Fetch, followed by Pull, followed by Push.

We can also verify from GitHub, if Push was successful or not:

verify that github has received the push

Resolve merge conflicts

Merge conflicts are quite common if multiple developers are working for the same repository. This process is same irrespective of where you have hosted the centralized git repository. To know more on the merge conflicts and steps to resolve the same, click here.

Delete Remote information

Finally, let’s delete the remote. By this, we mean to remove the remote information only which is the equivalent of ‘git remote remove origin’. For this, go to Team Explorer -> Settings -> Repository Settings, and expand Remotes:

click on remove to remove remote information

Click on ‘Remove’ to remove the remote.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s