Connect Your Github To VS Code

Introduction

If you are reading this, then you probably know what GitHub and VS Code(Visual Studio Code). If not then here you go. Github is like social media for programmer where you can upload your code/ project file and get star, fork, and can be part of the developer and work on the project with other programmers on Github. VS Code is an IDE(Integrated Development Environment), We can make it more powerful by using the extensions and it's very easy to customise. It comes with emmet pre-built which no other text editor does and it also allows us to tweak into its code so we can even modify it's environment variables according to our preferences. It has a large collection of extension which you can use for your requirement. VS Code is developed by Microsoft.

Before we started, I wanna thank @Risabh Singh for helping me to write the blog. Make sure check his Dev page too. So lets get started.

• REQUIREMENT

  • GitHub : Create a GitHub account. If you have then it's great.
  • Git: Download and Install Git and login to your GitHub account.
  • VS Code : Download and Install VS Code

  VS CODE

  After downloading when you open VS Code, we need to download the extension to connect VS Code and GitHub. To download and install extension simply click on extensions button on left side panel or simply click Ctrl+Shift+X on windows and Cmd+Shift+X on mac to open extensions panel and then search GitHub Pull Requests and Issues and download the extension.

  

  After Installing extension login to your GitHub account by clicking on the Accounts button located at the bottom left side of the panel.

  

  GitHub

  Create a repository on your GitHub account and you can add README.md file for the initial part and Copy the SSH Code by clicking on Code and then simply you can copy or click on copy to clipboard. Now you have SSH Code of your GitHub repository.

  

  VS Code

  Open your VS Code and make sure you are in your desired folder to clone your GitHub repository. So now simply, we have to type some GitHub command.

  • git clone

    • This command will clone your all files and folder you have in your GitHub repository.
    • Command

    git clone https://github.com/surajsrv11/A-FRAME-.git
    

    • Don't clone GitHub repository in the same folder again and again. Its a one time command for the same folder. If you do, then it will give you an error.

  Now after cloning your repository, you can work on it and make necessary changes.

  Make sure when you are using next GitHub command, you should open the integrated terminal in the repository folder.

  

  When you are going to execute git command for the first time, you will have to log in to your GitHub account.

  • git add .
    • The git command adds a change in the working directory to the staging area.
    • It tells Git that you want to include updates to a particular file in the next commit.
    • If it works it does not show anything in the terminal
  • git commit -m "Your Message"
    • The "commit" command is used to save your changes to the local repository.
    • In the double quote, you can add your own message.
  • git push origin master
    • git push origin will push changes from all local branches to matching branches the origin remote.
    • In simple word, it will upload all the changes that you make in the local repository folder to the GitHub.

By Using this few steps, you can clone, edit and push to origin master easily in the GitHub repository. Hope you like the post. Thank you for reading the blog.