K
K12worX Education501(c)(3) Public Charity
Jamboree

Creating Branches

Branches let you work on features without affecting the main codebase. Learn how to create, switch, and manage branches effectively.

What You'll Learn

  • What branches are and why we use them
  • How to create and name branches
  • Switching between branches
  • Keeping branches organized
  • Deleting branches after merging

What is a Branch?

A branch is an independent line of development. Think of it as a parallel universe where you can experiment without affecting the original.

Visual Analogy

main branch:      A---B---C---D
                           \
feature branch:             E---F---G
  • main: The stable, production code
  • feature: Your experimental work
  • E, F, G: Your commits
  • Eventually G merges back into main

Why Use Branches?

Protection:

  • Main branch stays working
  • Your experiments don't break things
  • Easy to abandon if needed

Collaboration:

  • Multiple people work simultaneously
  • Each person has their own branch
  • No stepping on each other's toes

Organization:

  • One feature per branch
  • Clear what each branch does
  • Easy to track progress

Creating Your First Branch

Check Current Branch

Always know where you are:

git branch

Output:

* main

The * shows your current branch

Create New Branch

Method 1: Create and switch:

git checkout -b feature/add-blog-page

Method 2: Two-step:

git branch feature/add-blog-page    # Create
git checkout feature/add-blog-page  # Switch

Method 3: Modern syntax:

git switch -c feature/add-blog-page

All do the same thing! Use what you prefer.

Verify Branch Creation

git branch

Output:

  main
* feature/add-blog-page

You're now on the new branch!

Branch Naming Conventions

Standard Patterns

Feature branches:

feature/add-user-profile
feature/implement-dark-mode
feature/create-blog-section

Bug fixes:

fix/navigation-menu-bug
fix/broken-image-links
fix/form-validation-error

Updates/Improvements:

update/homepage-content
update/dependencies
update/readme-instructions

Documentation:

docs/add-contributing-guide
docs/update-api-documentation

Best Practices

✅ Good names:

  • Descriptive: feature/add-contact-form
  • Use hyphens: fix/mobile-menu-bug
  • Lowercase: update/color-scheme
  • Prefix shows type: feature/, fix/, update/

❌ Bad names:

  • Too vague: my-branch, test, asdf
  • Too long: feature/add-contact-form-with-validation-and-email-sending
  • Spaces: my feature branch (won't work!)
  • Special chars: feature@contact, fix#123

Our Convention

{type}/{brief-description}

Types:

  • feature/ - New functionality
  • fix/ - Bug fixes
  • update/ - Improving existing code
  • docs/ - Documentation only
  • refactor/ - Code cleanup (no new features)

Switching Branches

Switch to Existing Branch

# Method 1 (older)
git checkout main

# Method 2 (newer)
git switch main

Before Switching

Important: Commit or stash your changes first!

# Check for uncommitted changes
git status

# If you have changes:
# Option 1: Commit them
git add .
git commit -m "WIP: work in progress"

# Option 2: Stash them (temporary save)
git stash

# Now you can switch
git checkout main

What Happens When You Switch

Your files change to match that branch:

  • New files appear/disappear
  • Content changes to that branch's version
  • VS Code updates automatically

It's like time travel!

Working with Branches

Check Which Branch You're On

Command line:

git branch

VS Code:

  • Look at bottom-left corner
  • Shows current branch name

Terminal prompt:

  • Many terminals show branch in prompt
  • Example: (main) or (feature/blog)

List All Branches

Local branches:

git branch

Remote branches (on GitHub):

git branch -r

All branches (local + remote):

git branch -a

Create Branch from Specific Point

From main:

git checkout main
git checkout -b feature/new-feature

From another branch:

git checkout feature/existing-feature
git checkout -b feature/related-feature

From specific commit:

git checkout -b fix/old-bug abc123

Keeping Branches Up to Date

Update Your Branch with Latest Main

Why: Main branch gets updated while you work

How:

# Switch to main
git checkout main

# Get latest changes
git pull

# Switch back to your branch
git checkout feature/your-feature

# Merge main into your branch
git merge main

Or use rebase (advanced):

git checkout feature/your-feature
git rebase main

Resolving Conflicts

If main and your branch changed the same lines:

  1. Git shows conflict:
CONFLICT (content): Merge conflict in app/page.tsx
  1. Open conflicted file:
<<<<<<< HEAD
Your changes
=======
Changes from main
>>>>>>> main
  1. Edit to resolve:
  • Choose which version
  • Or combine both
  • Remove conflict markers
  1. Mark as resolved:
git add app/page.tsx
git commit -m "Resolve merge conflict"

Deleting Branches

When to Delete

Delete branch when:

  • Pull request merged
  • Feature abandoned
  • Work moved to different branch

Don't delete:

  • Current branch (can't delete what you're on)
  • main branch (protect main!)
  • Unmerged work (unless abandoning)

Safe Deletion

# Delete merged branch
git branch -d feature/completed-feature

Git prevents deletion of unmerged work!

Force Deletion

# Delete unmerged branch (careful!)
git branch -D feature/abandoned-feature

⚠️ Warning: This deletes work! Use only if you're sure.

Delete Remote Branch

After PR is merged:

# Delete branch on GitHub
git push origin --delete feature/completed-feature

GitHub usually does this automatically after PR merge.

Branch Management Tips

1. One Branch Per Feature

✅ Good:

  • feature/add-blog-page - Just the blog page
  • fix/navigation-bug - Just the bug fix

❌ Bad:

  • Branch with blog + navigation + colors + everything

2. Keep Branches Short-Lived

Ideal: Few hours to few days

Why:

  • Smaller changes easier to review
  • Less likely to conflict
  • Faster feedback

3. Sync Often

# Every morning
git checkout main
git pull
git checkout feature/your-feature
git merge main

Prevents large conflicts!

4. Clean Up Old Branches

# List merged branches
git branch --merged

# Delete them
git branch -d old-branch-1
git branch -d old-branch-2

5. Use Descriptive Names

Others should understand what the branch does just from the name.

Common Scenarios

Scenario 1: Start New Feature

# Get latest main
git checkout main
git pull

# Create feature branch
git checkout -b feature/add-search

# Start working!

Scenario 2: Switch Tasks Mid-Work

# Save current work
git add .
git commit -m "WIP: search feature in progress"

# Switch to new task
git checkout -b fix/urgent-bug

# Fix bug, commit, push
git add .
git commit -m "Fix urgent bug"
git push

# Switch back
git checkout feature/add-search

# Continue working

Scenario 3: Abandon Feature

# Switch away from branch
git checkout main

# Delete abandoned branch
git branch -D feature/bad-idea

# Start fresh
git checkout -b feature/better-idea

Scenario 4: Rename Branch

# Rename current branch
git branch -m new-branch-name

# Or rename any branch
git branch -m old-name new-name

VS Code Git Integration

View Branches

  1. Click branch name (bottom-left)
  2. See all branches in dropdown
  3. Click to switch

Create Branch

  1. Click branch name
  2. Select "Create new branch"
  3. Enter name
  4. Press Enter

Merge Branches

  1. Source Control panel
  2. Click ... menu
  3. Select "Branch" → "Merge Branch"
  4. Choose branch to merge from

Troubleshooting

"Already exists"

Error:

fatal: A branch named 'feature/blog' already exists.

Solution: Use different name or delete old branch:

git branch -d feature/blog
git checkout -b feature/blog

"Please commit your changes"

Error:

error: Your local changes to the following files would be overwritten by checkout

Solution: Commit or stash first:

git stash
git checkout other-branch
git stash pop  # When ready to get changes back

"Diverged" Branches

Error:

Your branch and 'origin/feature/blog' have diverged

Solution:

git pull --rebase

Quick Reference

Create branch:

git checkout -b feature/name      # Create and switch
git branch feature/name           # Create only
git checkout feature/name         # Switch only

Switch branches:

git checkout main                 # Switch to main
git checkout feature/name         # Switch to feature

List branches:

git branch                        # Local branches
git branch -r                     # Remote branches
git branch -a                     # All branches

Delete branch:

git branch -d feature/name        # Safe delete
git branch -D feature/name        # Force delete

Update branch:

git checkout main
git pull
git checkout feature/name
git merge main

Hands-On Exercise

Exercise: Create and Use a Branch

  1. Check current branch:
git branch
  1. Create new branch:
git checkout -b feature/practice-branch
  1. Make a change:
  • Edit any file
  • Save it
  1. Commit change:
git add .
git commit -m "Practice commit on feature branch"
  1. Switch back to main:
git checkout main

  1. Notice: Your change disappeared! (It's on the other branch)

  2. Switch back:

git checkout feature/practice-branch

  1. Your change is back!

  2. Clean up:

git checkout main
git branch -D feature/practice-branch

What's Next

Now that you can create and manage branches, let's learn how to save your work with commits:

Making Commits →