Setup Git + Visual Studio Code Tutorial


Pretext:

Git Distributed Version Control System (DVCS) is been used in over 90% of Software Projects. With the ever growing of Visual Studio Code over the past couple of years, most of us learning VS Code may have a question, how do I use Git with Visual Studio Code?

Prerequisites

Note: We assume that you are very new to git and do not have set-up GitHub with VS Code, accordingly some steps can be skipped.

  • Visual Studio Installed (either of Mac, Linux, Windows)
  • Git installed on your Device.
  • Should have basic understanding of Git Commands - init, config, commit, add, status, log, push e.t.c.
  • A GitHub account


How to create a git local repository using VS Code

  1. Open VS Code,
  2. Open Terminal (Can use any shell zsh, bash or CMD, PowerShell)
  3. Now move to a location where you want to create your project folder and create your project folder, and move into that folder, and go a git init to make it as Git Project.
    Example:
    % git init

    Example - Create a git project
  4. Now to go File -> Open Folder -> Choose the project folder you created.

✏️ Note you can even create a local git repository outside of VS Code and then import.



Setup Github email and user

  1. If you are using git for the first time, and have not set user and email, follow below steps,
  2. Open Terminal,
  3. Add User: git config --global user.name "your-user-name"
  4. Add Email: git config --global user.email "your-email@your-domain.com"


How to stage and commit code into git local repository using VS Code

  • For the demo purpose, lets create a simple file hello.html and add a h1 tag saying hello,
    <h1>Hello Git + VS Code!</h1>
  • Execute command: git add hello.html to stage the file,
  • Now, execute the command: git add -m "initial commit"


How to push local git repository using VS Code

  1. In Terminal, set the remove branch details by running the command: |HSgit remote set-url origin https://github.com/your-user/my-git-proj.git|
  2. Run command: git push origin main
  3. You will get a pop-up to add your GitHub credentials in VS Code.
    Extension GitHub wants to sing in
  4. You will be redirected to GitHub website to provide access,
  5. on GitHub, create a project with the same name as your local git project (note if your repo contains sensitive info, make it a private repo)
    Create Project in GitHub
  6. Now run the command git push -u origin master
% git push -u origin main
Enumerating objects: 6, done.
Counting objects: 100% (6/6), done.
Delta compression using up to 8 threads
Compressing objects: 100% (2/2), done.
Writing objects: 100% (6/6), 489 bytes | 489.00 KiB/s, done.
Total 6 (delta 0), reused 0 (delta 0), pack-reused 0
To https://github.com/bladerunr2049/my-git-proj.git
 * [new branch]      main -> main
branch 'main' set up to track 'origin/main'.


Have Questions? Post them here!
Advertisements
Try Out Code2care Dev Tools:

Advertisements

Advertisements
Code2care is an initiative to publish and share varied knowledge in programming and technical areas gathered during day-to-day learnings and development activities.

Students and software developers can leverage this portal to find solutions to their various queries without re-inventing the wheel by referring to our easy to understand posts. Technical posts might include learnings, tutorials, trouble-shooting steps, video tutorials, code snippets, how-to, blogs, articles, etc.

🎉 We are celebrating the 10th years of Code2care! Thank you for all your support!

We strongly support Gender Equality & Diversity.


echo('');