Frontend Academy · Lesson

Branching: branch checkout merge

Create feature branches, switch between them, merge branches back to main, and resolve simple merge conflicts.

Branching: branch checkout merge is a free Frontend Academy lesson on CoddyKit — lesson 2 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the Frontend Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.

Why Branches?

Branches let multiple features and bug fixes be developed in parallel without interfering with each other. Main (or master) stays stable while work-in-progress lives in feature branches.

Listing and Creating Branches

git branch lists branches. git branch name creates a new branch. The new branch starts from the current commit.

git branch             # list all branches
git branch feature/auth # create a new branch
git branch -d feature/auth # delete merged branch

Switching Branches

git checkout branchname switches to an existing branch. git checkout -b branchname creates and switches in one step. The modern equivalent: git switch.

git checkout main           # switch to main
git checkout feature/auth   # switch to existing branch
git checkout -b hotfix/nav  # create + switch

# Modern (git 2.23+):
git switch main
git switch -c feature/auth

Typical Branch Workflow

1) Switch to main. 2) Pull latest. 3) Create feature branch. 4) Make commits. 5) Merge back to main. 6) Delete the feature branch.

git switch main
git pull
git switch -c feature/dark-mode
# ... make commits ...
git switch main
git merge feature/dark-mode
git branch -d feature/dark-mode

Merging Branches

git merge branchname incorporates changes from the named branch into the current branch. Git tries to merge automatically. Fast-forward merge happens when there's a clean history.

git switch main
git merge feature/auth
# Fast-forward: no merge commit if history is linear

Merge Commits

When both branches have diverged, Git creates a merge commit that has two parent commits. This preserves the full history of both lines of development.

Merge Conflicts

When the same file was changed in both branches, Git can't auto-merge and marks the conflict. You edit the file to resolve it, then commit.

<<<<<<< HEAD
const COLOR = 'blue';
=======
const COLOR = 'red';
>>>>>>> feature/theming

// After resolving:
const COLOR = 'navy'; // your decision

git add styles.css
git commit

git rebase — Linear History

git rebase main replays your branch's commits on top of the latest main, creating a linear history without merge commits. Use for feature branches before merging; avoid rebasing shared branches.

git switch feature/auth
git rebase main  # replay commits on top of current main

HEAD — Where You Are

HEAD is a pointer to the current branch tip (or a specific commit in detached HEAD state). git log shows HEAD's position. HEAD~1 is the previous commit, HEAD~3 is three back.

Stashing Work in Progress

git stash saves uncommitted changes and reverts to a clean working tree. Use it when you need to switch branches without committing incomplete work. git stash pop restores them.

git stash           # save WIP
git switch hotfix/urgent
# ... fix and commit ...
git switch feature/auth
git stash pop       # restore WIP

Branch Naming Conventions

Common patterns: feature/feature-name, fix/bug-description, hotfix/critical-fix, chore/dependency-update. Consistent naming makes the branch list readable.

Quick Check

What command creates a new branch and switches to it in one step?

Recap: Git Branching

git branch creates. git checkout/switch navigates. git merge integrates. Resolve conflicts by editing marker blocks. git stash saves WIP. git rebase for linear history. Use feature branches for all new work; keep main stable. Delete merged branches to keep the list clean.

Frequently asked questions

Is the “Branching: branch checkout merge” lesson free?

Yes — the full text of “Branching: branch checkout merge” is free to read here on the web, and the Frontend Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the Frontend Academy course, upgrade to CoddyKit PRO.

What will I learn in “Branching: branch checkout merge”?

Create feature branches, switch between them, merge branches back to main, and resolve simple merge conflicts. You practise Frontend Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start Frontend Academy?

No prior experience is required. Frontend Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 2 of 4, so you can start here or from the beginning and move at your own pace.

How long does the “Branching: branch checkout merge” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this Frontend Academy lesson?

Yes. Every Frontend Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

← Back to Frontend Academy