Master Git & GitHub
from Scratch
Everything you need to upload, update, and manage your projects safely — HTML, CSS, JavaScript, Python, and isolated environments. Never lose your work again.
Install & Configure Git
Use the same email as your GitHub account.
SSH Key Setup
SSH authenticates you automatically — no password every time you push. Do this once, then forget it exists.
Go to github.com → Settings → SSH and GPG keys → New SSH key, paste the full output from above, save.
That green line means it works. You're done with SSH forever.
How Git Works — The Mental Model
Git has 4 zones. Every command moves your files between them.
Working Directory
Your actual folder on disk — the files you edit in VSCode or PyCharm. Git sees changes here but hasn't recorded them yet.
Staging Area
A holding zone. You choose exactly which changes go into the next commit. git add file.html moves something here.
Local Repository
The full history of your project, stored inside the hidden .git folder. git commit saves a permanent snapshot.
GitHub (Remote)
The copy on the internet. git push syncs your local commits up. git pull brings remote changes down.
First Upload — The Safe Way
✗ Wrong order
- Create repo on GitHub with README
- git clone → into existing project folder
- 🔥 Your files get deleted or mixed up
✓ Correct order
- Start from your local project folder
- git init → add → commit
- Create EMPTY repo on GitHub (no README)
- git remote add → git push
See the interactive .gitignore builder in section 07 to generate the right content.
On GitHub: New repo → give it a name → leave all checkboxes UNCHECKED → Create. Copy the SSH URL (starts with git@github.com:...).
Done. Refresh GitHub — your project is there. The -u flag means future pushes only need git push.
Daily Workflow — Add, Commit, Push
Good commit messages
"add contact form"
"fix navbar on mobile"
"update portfolio images"
"update" ✗
"fix" ✗
"asdf" ✗
Check history
See all your snapshots anytime:
git log --oneline
git log
git diff HEAD~1
Undo last commit
If you commit by mistake — before pushing:
git reset HEAD~1
This keeps your files, just removes the commit.
Branches — Work Without Breaking Things
A branch is a parallel version of your project. You experiment on a branch — if it works, you merge it into main. If it fails, you delete the branch and nothing is harmed.
.gitignore Builder
Click what applies to your project — your .gitignore is generated below. Copy it into a file named .gitignore at the root of your project.
Generated .gitignore:
Python & Isolated Environments
✓ Push to GitHub
- All .py / .html / .js / .css files
- requirements.txt
- .gitignore
- README.md
✗ Never push
- venv/ folder
- __pycache__/
- .env (secrets, API keys)
- *.sqlite3 database files
Working With Existing Repos
Fix Common Mistakes
Command Cheatsheet
| Command | What it does | When to use |
|---|---|---|
git status | Show changed/staged/untracked files | Before every add or commit |
git add . | Stage all changes | Ready to commit everything |
git add <file> | Stage one specific file | Committing partial work |
git commit -m "msg" | Save a snapshot with a message | After staging |
git push | Upload commits to GitHub | After committing |
git pull | Download latest from GitHub | Before starting work |
git log --oneline | See compact commit history | Review what's been done |
git diff | Show line-by-line changes | Before staging |
git branch | List branches | Know where you are |
git checkout -b name | Create & switch to branch | Starting new feature |
git merge <branch> | Merge branch into current | Feature complete |
git stash | Temporarily save uncommitted work | Need to switch branch fast |
git stash pop | Restore stashed work | Back on your branch |
git reset HEAD~1 | Undo last commit (keep files) | Committed too soon |
git remote -v | Show GitHub connection | Debugging push issues |
git rev-parse --show-toplevel | Show where .git root is | Diagnosing repo problems |