Git and GitHub

What this is

Git is a tool that tracks every change you make to your code.

GitHub is a website that stores your Git history online so the code is safe, shareable, and deployable.

They are two different things. Git runs on your computer. GitHub lives on the internet.

Why it matters

Without Git, one bad change can break everything with no way back.

With Git, every saved version is recoverable. Vercel also reads directly from GitHub to deploy your site — so Git is not optional. It is part of the build pipeline.

What to do

How Git works

Think of Git like a save system with checkpoints.

Working files -> Stage changes -> Commit (save a checkpoint) -> Push to GitHub

• Working files: the code you are editing right now.
• Stage: mark which changes you want to include in the next save.
• Commit: create a named checkpoint with a short message describing what changed.
• Push: send that checkpoint to GitHub so it is stored online.

Install Git

Windows:

Download from git-scm.com/download/win.

During install, keep the defaults. When asked about the default branch name, choose main.

After install, close and reopen your IDE terminal, then check:

git --version

You should see something like git version 2.44.0.

Mac:

Git usually comes with Xcode tools. Run:

xcode-select --install

Then check:

git --version

Set up your identity

Git needs to know who is making commits. Run these once after installing:

git config --global user.name "Your Name"
git config --global user.email "you@example.com"

Use the same email as your GitHub account. This email will be visible in your public commit history — use an email you are comfortable sharing.

Create a GitHub account

Go to github.com and create a free account if you do not have one.

GitHub is where your project will live online. Vercel connects to GitHub to deploy your site automatically every time you push.

The three commands you will use most

Before staging files, always check what has changed:

git status

This shows which files are modified. Check it before every commit to make sure you are not staging files that contain secrets or passwords.

Then stage, commit, and push:

git add .
git commit -m "describe what changed"
git push

• git add . stages all changed files. Only run this after checking git status and confirming your .gitignore is in place.
• git commit -m "..." saves a checkpoint with a message.
• git push sends the checkpoint to GitHub.

You do not need to memorise every Git command. These three cover most of Vibe 101.

What a good commit message looks like

add hero section
fix nav link color
update footer with contact info

Short, plain, describes what changed. Not "update" or "fix stuff".

Check Git is working

Inside your project folder, run:

git status

If Git is tracking the folder, it will show which files have changed. If it says not a git repository, the project has not been initialised yet — that happens in the next steps when you create the project.

Common mistakes

• Skipping Git because it feels complicated — it gets easier after the first commit.
• Using a different email in Git config than on GitHub.
• Committing without a message, or using a message like "aaa" or "test".
• Pushing broken code — always check localhost works before pushing.
• Confusing Git (the tool) with GitHub (the website).
• Running git add . without checking git status first — you may accidentally stage files with secrets or passwords.
• Not having a .gitignore file — AI-scaffolded projects usually include one, but always verify it exists before your first commit.