Git & GitHub Tips

🧠 Git & GitHub Tips

A quick reference for common Git commands, best practices, and GitHub workflows that support this learning project. This page is focused on personal use, small team collaboration, and structured growth.

🔧 Common Git Commands

Action	Command
Initialise a repo	git init
Clone a remote repo	git clone <url>
Stage a file	git add <filename>
Stage everything	git add .
Commit with a message	git commit -m "✨ feat(js): added todo"
Push to origin	git push origin main
Pull latest changes	git pull
Create a branch	git checkout -b feature/react-counter
Switch branch	git checkout main
Merge a branch	git merge feature/react-counter
See commit history	git log --oneline --graph
Unstage a file	git restore --staged <filename>
Undo last commit (keep changes)	git reset --soft HEAD~1

🛠 Recommended Git Workflow

✅ 1. Create an Issue

Use GitHub Issues to log new:

• Learning topics
• Projects
• Bugs
• Questions Use templates and labels to stay organised.

✅ 2. Create a Branch

git checkout -b type/short-description
# e.g. feat/html-form-guide or fix/quiz-bug

✅ 3. Commit Early, Commit Often

Use conventional commit messages with emoji:

✨ feat(js): build fetch-based weather app
🐛 fix(dom): button event not triggering
📝 docs(css): update flexbox notes

✅ 4. Push and Open Pull Request

Once you're ready:

git push -u origin feature/my-branch

Then open a PR, link the issue, and let GitHub auto-label it.

---

📂 Branch Naming Conventions

## 📂 Recommended Branch Naming

| Prefix     | Use For                           | Example                       |
|------------|------------------------------------|-------------------------------|
| `feat/`    | New feature/project                | `feat/react-todo-app`         |
| `fix/`     | Bug fixes                          | `fix/css-styles`              |
| `docs/`    | Wiki/notes/reflections             | `docs/add-javascript-note`    |
| `refactor/`| Internal clean-up                  | `refactor/js-functions`       |
| `chore/`   | CI, config, label, or meta changes | `chore/update-labeler`        |

🤖 GitHub Features to Use

🗂 Projects

Visualise your roadmap with columns like:

• To Learn
• In Progress
• Done

🔖 Labels

Auto-label issues with:

• Topic (topic:js)
• Status (status:in-progress)
• Type (type:project)

Use .github/labeler.yml + GitHub Actions to automate.

🧾 Issue Templates

Make sure you use templates:

• learning-topic.yml
• project.yml
• bug.yml
• reflection.yml

You can find these in .github/ISSUE_TEMPLATE/

⚙ GitHub Actions

Automate:

• Prettier formatting
• Auto-label PRs
• Weekly digests
• Badge updates

🧠 Pro Tips

• ✅ Use git status often to see what’s changed
• 🔁 Use git stash to save WIP before switching tasks
• 💥 Always pull before pushing (git pull origin main)
• 🔀 Don’t commit directly to main — use branches
• 🧪 Make small, focused PRs — it helps with learning & tracking

📘 See Also

• Project Structure
• GitHub Workflow Automation
• Weekly Reflection Template