Push your Code to GitHub Repository from Visual Studio

Keeping a track of your changes and its history is very important for a developer. GitHub is a code hosting platform for version control and collaboration. It lets you and others work together on projects from anywhere.

In this post we will push our code to the created repository in GitHub using the Visual Studio. Check out my previous post where we saw How to Create GitHub Repository?

Pre-requisites

Visual Studio
GitHub Account

Visual Studio download link can be found in downloads page.

Push your Code to GitHub

I hope you have the project or code changes ready in the Visual Studio to be pushed to GitHub. You will have similar project like this with a Solution and under the solution one or more projects.

If you have read my post on Pushing the Code to GitHub using Command Line, you might be knowing that here also we will be following the same approach. The only change will be, here we will be following it visually with User Interface.

Right click on the solution file and click Create Git Repository. On the older version of Visual Studio, it will be “Add Solution to source control”.

If you are using older version of Visual Studio, you will see that, as soon as you click, an empty git repo is created locally and a blue lock symbol comes in front of every file and folder. For latest visual studio, a Git popup will be shown asking to create a Git repository.

You will have to sign in to GitHub and give a name of the repository. Once you sign in, your GitHub username will be populated in Owner and Account field. Also, it will show you the new URL created for your GitHub repo.

Now, you just have to click Create and Push. Rest everything will be taken care by Visual Studio. You can verify going to the GitHub whether your code is pushed or not. On each file and folder, you will see a blue lock symbol.

For older version of Visual Studio, after you click on Add Solution to Source Control, you come to Team Explorer tab. If not shown, Click on View -> Team Explorer. In Team Explorer, you see many options as below.

Click on Sync and you will find 3 options to choose from – > GitHub, Azure DevOps and Remote Repository. Select the GitHub Repo and login. Repository name will be auto populated with the same name as Project. You can change it or keep it default. You can check the checkbox to make it private. After that, click on connect. Your code will be pushed to the GitHub repo.

If not pushed, come back on Home screen of Team Explorer, again click on Sync. This time, you will be shown the connected GitHub repo link. Just click on Sync. That’s all. Also you can check in the Changes tab if no files is present there. If present, give a commit message and Click on Commit All and Push.

On the latest version, this process has become very easy with the help of Git plugin in the Visual Studio. If you don’t find it, don’t worry, Visual Studio will show you a prompt to download it when you try to access the Team Explorer.

Now we will see, how to commit and push new changes. Till now, we have pushed the complete code to the GitHub repo. Now, try making changes in the code, what do you see against the file you just made the change to. I made some changes to Home.js file.

When you make any changes, you will see a red tick mark in front of the file. This tells us that, there are unstaged changes. Go to the Git Changes tab. You find the files, you made changes to in the Changes(n) category.

Either you can directly commit all, or Stage them before commit. If you want to stage them, select the Commit All dropdown and click “Stash All and Keep Staged”. This will move your file under Stashes with an unique reference ID.

We will not stage it, we will directly Commit All with a commit message to be provided in the box. You can also Commit and Push at the same time, we do have an option for that in the dropdown.

When you click Commit All, the commit will be created locally, now click on Push arrow button to push it to GitHub repo.

You will see the success message, when it is pushed to remote repo.

If you have the changes in the GitHub repo which are not available in the local repo, you can make a pull request first and then make your changes on top of it.

It is always a good practice to pull the code first and then make your changes to avoid losing the code changes made by your team members.