GitHub Guide for Beginners: Repos, Branching, Merging, and Commits Explained

Welcome! In this section, we’re going to break down the basics of GitHub so you can start building projects, collaborating, and having fun.

GitHub can seem overwhelming at first. But here’s the trick: as a newbie, all you really need to know is what repository, branching, merging, and committing mean. Everything else can wait.

To make your first steps with GitHub easy and enjoyable, I’ve turned tech jargon into simple examples.

What is Github?

Callout box explaining what a GitHub repository is for beginners. It’s like “Google Docs for code,” but designed for collaboration and keeping your work safe. Created by Karo from Product with Attitude.

💡GitHub = Google Docs for code
Think of GitHub as a giant online folder for your project where every change you make is saved, tracked, and easily shared.
It’s like “Google Docs for code,” but designed for collaboration and keeping your work safe.
👀 Example
Say you’re building a homepage. At 2pm everything worked perfectly, but now, after you made a tiny change in code, the whole site crashed.
With GitHub, you just roll back to the 2pm version - the stable one - undoing the mess in seconds.

What is GitHub Repository?

Callout box explaining what a GitHub repository is for beginners. A repository = a folder for your project. Created by Karo from Product with Attitude.

💡A repository = a folder for your project.
It’s where you keep all the files and changes for a project in one safe place.
👀 Example
Say you’re building a homepage. You can create a repository called “Homepage” and store all your files there.
🚀 Open your first Github repo in 30 seconds:
1. Sign up on github.com and log in.
1. Click the New Repository button - usually green and on the top left or center.
2. Give your repo a name, for example: My Homepage
3. Select Add a README file. This is not required, but recommended. README files are like a welcome note for people who visit your repository.
  Example: the ReadMe file I built for StackShelf.app here.
4. Click Create Repository.
  That’s it! You’ve just made your first repo.

What is a Branch?

A callout box explaining what a branch is. 💡A branch = a safe copy of your project. Created by Karo from Product with Attitude.

💡A branch = a safe copy of your project.
A branch is a way to work on one task (like adding a new feature or fixing a bug) without making changes in the main project. A branch doesn’t change main until you merge it.
👀 Example
Say you’re building a homepage. You want to add a new contact form, but you’re not sure it’ll work perfectly right away. You can create a branch called “contact-form” (a safe copy of your project) make changes there, and test everything out. Once you’re happy, you can add those updates back to your main homepage project.

What is a Commit?

A callout box explaining what a commit is. Merging = Commit = saving progress in the specific branch you’re editing If something breaks, you can revert or restore to a previous commit. Created by Karo from Product with Attitude.

💡Commit = saving progress in the specific branch you’re editing
If something breaks, you can revert or restore to a previous commit.
👀 Example
Say you’re building a homepage. You create a branch called “contact-form”. After you add a new image, you make a commit. This saves your changes and lets you go back to that version if you ever need to.

What is Merging?

A callout box explaining the meaning of merging. Merging = adding the copied version of your project back to the main project. Created by Karo from Product with Attitude.

💡 Merging = adding the copied version of your project back to the main project.
Commits live on a branch; merging moves those commits into another branch.
👀 Example
Say you’re building a homepage. You created a branch called “contact-form”, tested everything, and now you can merge it back to your main homepage project.

What’s the Difference Between Committing and Merging?

A callout box explaining the difference between a commit and a merge. 💡 Commit = saving progress in the specific branch you’re editing 💡 Merge = combining changes from one branch into another. Created by Karo from Product with Attitude.

💡 Commit = saving progress in the specific branch you’re editing
💡 Merge = combining changes from one branch into another
👀 Example
Say you’re building a homepage - on a “contact-form” branch - and made several commits there. Once you’re done, you merge that branch back into your main project—combining all those saved snapshots (commits) from “contact-form” into your main homepage project.

Quick GitHub Tips For Vibecoders

Use GitHub from Day 1: Create a repository the same day you start coding. Early version control means every change is tracked and you have a safety net from the start.
Branch for Every Feature: For each new feature or fix, create a separate branch (e.g., feature/login, bugfix/password-validation). This keeps your work organized, allows safer collaboration, and ensures only finished work appears in your main product.
Merge branches only after tests/reviews: Always test and review code before merging changes into your main project. This catches bugs early and helps keep your project stable and maintainable.
Commit often: Save work frequently, ideally after each logical piece is complete (like when you finish a UI button or fix a bug). Don’t wait until the end of the day! This gives you checkpoints and makes it easier to undo mistakes.

Product with Attitude