Using Github With Visual Studio Code



By: Matt Wollner

More about Raghav - Step 1: Install git on your system2:46 Step 2: Create account on github - https://github.com/3:27. How to install the GitHub Extension for Visual Studio 2017? Before Installing GitHub Extension, the only available default connection is Visual Studio Team Services. To install GitHub Extension for Visual Studio 2017, you should follow the mentioned below steps: Open Visual Studio.

Our Branch-Based GitHub Workflow

Now that Microsoft has acquired GitHub, our team here at Key2 Consulting is starting the transition from Team Foundation Server (TFS) to GitHub for our database source control. If you are accustomed to working with TFS, the transition to GitHub can be confusing.

In this blog post, we share a basic workflow we have adopted to start using GitHub as our project source control. Our GitHub workflow takes advantage of Visual Studio Code (VS Code). We will cover (in this post) the basics of how to get a local copy, push code changes to the development branch, and then pull those changes into the master branch.

Master Branch and Develop Branch

There are often many code changes in between releases when working on a project. Some of these changes are ready for deployment to a production environment, while some are under development and testing.

At Key2 Consulting, we use a branch-based workflow to help pick the changes that are ready for deployment. Our environment has two main branches: master (or main) branch and develop branch.

Hotfix branches are created to move code from the develop branch to the master branch, and are then deleted after master has been updated.

  • Master Branch – Once code is added to the master branch it is ready for deployment. The master branch will represent production-ready code.
  • Develop Branch – All ongoing development should be done in the develop branch.


Downloading a Branch (Clone)

Using Github With Visual Studio Codes

Let’s start by setting up our working environment. To do so, we will “clone” the develop branch. This will download the latest code in the development branch into our local PC.

In my personal working environment, I like to have a copy of both the develop and master branches. I create a root folder for the projects and a folder for each branch underneath.

  1. In Files Explorer, create a folder for your working develop environment.
  2. Open VS Code and open the new folder. File –> Open Folder
  3. Jump over to your GitHub website. Get the Clone HTML. Click the Clone or Download button and copy the URL.


  4. Clone the repository.
    • Back in VS Code, go to the Terminal command prompt and type in the command: git clone https://githuburl…

      • – In this example, I am pulling the https URL. You may set your URL to begin with git:// or use SSH transfer protocol user@server:path/to/repo.git.


      OR

    • Open the Command Palette… (Ctrl+Shift+P)

      • – Git: Clone


      – Paste in URL


  5. You should now see the repository in your local folder.

    6. In VS Code, on the bottom left of the window you will see what branch you are currently working with. Mine currently says “master”. I need to change it to develop. If you click on master you will see the git command prompt drop down, but sometimes you may not see all the branches that are in the GitHub project.


To refresh the ref list you may need to run the fetch command.

  1. In the Terminal command prompt (Ctrl+`), run the command:

    2. git fetch

  2. Now if you click on the branch name in the bottom left, you should see all your branches in the drop down. Select the develop branch.

Working With Your Local Copy

While working on your local copy of the repository, you should frequently get the latest version from GitHub. In Git, this is done with the “pull” command. If you are editing objects, you need to make sure you have the latest version before you begin.

Under the Source Control tab, click the “…” -> Pull
Or
Terminal command prompt
Git pull

Vs code connect to github


Using Github With Visual Studio Code 2019

Committing to the Remote Develop Branch

Using Github With Visual Studio Code Download

After you have made some code changes and they have all tested out, you will want to deploy the changes to the remote develop branch. From VS Code you will use the Stage, Commit and Push commands. All files that have been altered will show up in the Source Control tab.

Using Github With Visual Studio Code Pdf

  1. Select the files you wish to deploy from your local environment to the remote develop branch.
  2. “Stage”.

    3. a. You can stage files by selecting the files you wish to stage. Right click Stage Changes.

    b. Staging allows you to gather the files that you wish to commit.

  3. “Commit”.

    4. a. Add a message. Click the ellipsis and select Commit Staged.

    b. The commit will save your changes to your local repository. This can be a little confusing. You can no longer see the updated files, but they have NOT been pushed to the remote develop branch yet.

  4. “Push”.

    5. a. After the files have been committed to your local repository you will need to push them to the remote repository (aka GitHub server).


    Your code changes are now on the remote develop branch. If you browse to your GitHub server, you will see a message next to each item for when it was last committed, along with the message you added during the commit. Any other developer who runs a pull command will download your changes to their local environment.

    Deploying to Production

    We now want to deploy our code changes to production (our remote master repository). Most of the time we will not want to deploy all the code in the develop branch. We will create a new local branch from the master branch and copy over all the code changes we wish to deploy. We will then pull those changes to the remote master branch.

    1. Create a new branch from the master branch.