Git Workflow in VS Code — A Visual Recap

Both videos showed you the VS Code interface for Git. Here's a written reference so you don't have to rewatch.

The Source Control Panel

Click the Source Control icon in the left activity bar (or press Ctrl + Shift + G). This is your Git headquarters.

The panel shows:

Changes — files you've modified but haven't staged yet
Staged Changes — files ready to be committed
The commit message box at the top

Initialize a Repository

If you open a folder that isn't tracked by Git, VS Code shows a "Initialize Repository" button in the Source Control panel. Click it — it creates a .git folder and you're ready to go.

(Video 1: 0:35-0:55, Video 2: 1:55-3:48)

Staging and Committing

This is the core loop:

Edit a file — it appears under "Changes" with a U (untracked) or M (modified)
Stage it — click the + icon next to the file (or "Stage All Changes" + at the top)
Write a commit message — type in the message box at the top
Commit — click the checkmark icon above the message box (or Ctrl + Enter)

The file moves from "Changes" → "Staged Changes" → committed.

(Video 1: 1:25-2:04, Video 2: 3:48-6:07)

Gutter Annotations — See What Changed

VS Code shows colored indicators right in the gutter (the column to the left of line numbers):

Green bar — new lines added
Blue bar — existing lines modified
Red triangle — lines deleted
Click any gutter indicator to open a diff view comparing old vs new

This is your instant visual audit before committing. Never commit without scanning the gutters.

(Video 1: 2:40-4:04)

Branch Management

Create a new branch

Open the Command Palette (Ctrl + Shift + P)
Type "Git: Create Branch"
Name it (e.g., feature/exploratory-analysis)
The status bar in the bottom-left now shows your branch name

Switch branches

Click the branch name in the status bar → select another branch.

(Video 1: 2:10-2:33, 4:20-4:29)

Merging Branches

When you're done experimenting on a branch:

Switch to main (click status bar branch name)
Open Command Palette → "Git: Merge Branch"
Select the branch you want to merge in

VS Code merges the changes. If there are conflicts, you'll see "Merge Conflicts" in the Source Control panel with inline buttons to accept incoming/current/both changes.

(Video 1: 4:30-4:52)

Publish to GitHub (First Time)

Click the "Publish to GitHub" button in the Source Control panel
VS Code asks you to sign in to GitHub (OAuth in the browser)
Choose Public or Private visibility
VS Code creates the remote repo and pushes your code

You'll also see a "Publish Changes" button after committing.

(Video 1: 5:00-5:43, Video 2: 6:07-9:55)

Pulling and Syncing

To get the latest changes from GitHub:

Use the "Pull" button in the Source Control panel (or click the sync icon in the status bar)
VS Code fetches and merges remote changes

For a full sync (pull first, then push), use the "Sync Changes" button in the status bar.

(Video 2: 10:26-11:45)

Selective Staging

You don't always have to stage every change. The "Stage Selected Ranges" option (click a file → right-click in the diff view → "Stage Selected Range") lets you commit only specific lines within a file. This keeps your commit history clean — one bug fix per commit, one feature per commit.

(Video 2: 11:45-14:51)

Cloning an Existing Repo

Open VS Code
Press Ctrl + Shift + P → "Git: Clone"
Paste the repo URL from GitHub
Choose where to save it
VS Code opens the cloned folder automatically

(Video 1: 5:44-6:20)

Quick Reference

Action	VS Code Way	CLI Equivalent
Init repo	Source Control → "Initialize Repository"	`git init`
Stage file	`+` icon next to file	`git add <file>`
Commit	Message box + checkmark icon	`git commit -m "msg"`
Create branch	Palette → "Git: Create Branch"	`git checkout -b <name>`
Merge branch	Palette → "Git: Merge Branch"	`git merge <branch>`
Push	"Publish Changes" or sync button	`git push`
Pull	"Pull" or sync button	`git pull`
Clone	Palette → "Git: Clone"	`git clone <url>`
See diff	Click gutter indicator	`git diff`

Takeaway

You can go your whole career without typing a single git command in the terminal. VS Code's UI covers everything an analyst needs. Use the gutters for a visual audit before every commit, keep your messages meaningful, and sync regularly so your GitHub contribution graph stays active.