Technology

What is Git? Integrating GitHub with Visual Studio Code

Every developer remembers the moment they lost code they couldn’t recover. Maybe a file got accidentally deleted. Maybe you “improved” something that was working and couldn’t find your way back. Git exists precisely to prevent these moments — and once you understand it, you’ll wonder how you ever worked without it.

What is Git?

Git is a distributed version control system. It tracks changes to your files over time, allowing you to:

  • Go back to any previous version of your code
  • Work on multiple features in parallel (branches)
  • Collaborate with other developers without overwriting each other’s work
  • See exactly who changed what, and when

Created by Linus Torvalds in 2005 for Linux kernel development, Git is now the standard for version control across the software industry.

Git vs GitHub — not the same thing

This trips up almost every beginner. Here’s the distinction:

GitGitHub
What it isSoftware on your computerWebsite + cloud service
PurposeTrack changes locallyHost and share Git repositories
Who owns itOpen-source projectMicrosoft (acquired 2018)
Required?YesNo (but very useful)

You can use Git without GitHub. But GitHub makes it easy to back up your code, collaborate, and share your work publicly.

Key concepts

Before we set anything up, let’s establish the vocabulary:

Repository (repo): A folder that Git is tracking. Everything inside it — files, subfolders, history — is part of the repo.

Commit: A snapshot of your files at a point in time. Think of it as a save point in a video game.

Branch: A separate line of development. The default branch is usually called main (or master in older repos). Branches let you work on a new feature without affecting the main codebase.

Merge: Combining the changes from one branch into another.

Remote: A version of your repo hosted elsewhere (e.g., on GitHub). origin is the default name for the primary remote.

Push / Pull: git push sends your local commits to the remote. git pull fetches changes from the remote to your local machine.

Setting up Git

1. Install Git

Download Git from git-scm.com. Run the installer and accept the defaults.

Verify it’s installed:

git --version
# git version 2.44.0

2. Configure your identity

git config --global user.name "Rakesh Narayan"
git config --global user.email "rakesh@example.com"

This information appears in every commit you make.

3. Create a GitHub account

Go to github.com and sign up for a free account.

Your first repository

Option A: Start from scratch locally

# Create a folder
mkdir my-project
cd my-project

# Initialise Git
git init

# Create a file
echo "# My Project" > README.md

# Stage the file for commit
git add README.md

# Commit it
git commit -m "Initial commit"

Option B: Clone an existing repo from GitHub

git clone https://github.com/username/repository-name.git
cd repository-name

Integrating with Visual Studio Code

VS Code has Git support built in — no extensions needed.

1. Open your repo in VS Code

code .

Or: File → Open Folder → select your project folder.

2. The Source Control panel

Click the branch icon in the left sidebar (or press Ctrl+Shift+G / Cmd+Shift+G). This opens the Source Control panel — your Git home inside VS Code.

What you’ll see:

  • Changes — files that have been modified since your last commit
  • Staged Changes — files ready to be committed
  • Commits — the commit message input at the top

3. Making a commit in VS Code

  1. Edit a file (VS Code marks modified files with an M)
  2. In Source Control panel, hover over the file and click the + to stage it
  3. Type a commit message in the input box at the top
  4. Press Ctrl+Enter (Windows) or Cmd+Enter (Mac) to commit

4. Connecting to GitHub

If you haven’t linked your repo to GitHub yet:

Via VS Code:

  1. Open Command Palette (Ctrl+Shift+P / Cmd+Shift+P)
  2. Type Publish to GitHub
  3. VS Code will guide you through authentication and repo creation

Via command line:

# On GitHub: create a new empty repo, then:
git remote add origin https://github.com/YOUR_USERNAME/YOUR_REPO.git
git branch -M main
git push -u origin main

5. Push and pull in VS Code

Once connected to GitHub, the Source Control panel shows a sync button (⇅). Click it to push your commits and pull any remote changes.

Or use the Command Palette:

  • Git: Push — upload local commits to GitHub
  • Git: Pull — download remote changes

The Git workflow (day-to-day)

Most of your work will follow this cycle:

1. Pull latest changes (git pull)
2. Write code
3. Stage changes (git add)
4. Commit with a meaningful message (git commit -m "description")
5. Push to GitHub (git push)

While the built-in Git integration covers the basics, these extensions take it further:

  • GitLens — inline blame, history, and richer diff views
  • Git History — visual commit log with branch graph
  • GitHub Pull Requests — manage PRs without leaving VS Code

Writing good commit messages

A commit message is a note to your future self. Follow these conventions:

✅ "Add user authentication with JWT"
✅ "Fix null pointer in payment processor"
✅ "Refactor invoice PDF generation for performance"

❌ "fix"
❌ "WIP"
❌ "asdfgh"

A useful format: start with a verb in imperative mood. “Add”, “Fix”, “Update”, “Remove”, “Refactor”.


Next in this series: Git branching strategies for solo developers and small teams.