Learn Git Branching Interactively

Deniz Sivas
5 min readSep 20, 2023

--

I like the way https://learngitbranching.js.org/ uses to teach newbies how Git works.

In this series I will be solving all levels for local git usage so that you can start the same interactive course to sharpen your skills with Git Branching.

Introduction Sequence

  1. Introduction to git commits

This is the first level task that wants us to commit twice.

Given vs Expected

Solution

git commit
git commit

2. Branching in Git

In this level we are expected to create a new branch and switch to it.

Given vs Expected

Solution

git checkout -b bugFix

3. Merging in Git

Our objectives are the following,

Given vs Expected

Solution

git checkout -b bugFix
git commit
git checkout main
git commit
git merge bugFix

4. Rebase Introduction

Given vs Expected

Solution

git checkout -b bugFix
git commit
git checkout main
git commit
git checkout bugFix
git rebase main

Ramping Up

  1. Detach yo’ Head

To complete this level, we will detach the HEAD from bugFix and attach it to the commit instead.

Given vs Expected

Solution

git checkout C4

2. Relative Refs

Some notes for this level,

  • To move upwards one commit at a time = ^ (Caret)
  • To move upwards a number of times = ~<num>
Given vs Expected

Solution

git checkout bugFix^

3. Relative Refs #2

In this level we will be using tilda operator in order to avoid excessive usage of carets.

Also a note on branch forcing, I would like to use the original explanation here.

Current Branch

if we run git branch -f main HEAD~3 we get the below system.

Forced Branch

Let’s solve the level now.

Given vs Expectation

Solution

git branch -f main C6
git checkout bugFix~2
git branch -f bugFix HEAD^

4. Reversing Changes in Git

In this level we will be learning the usage of git reset and git revert.

Given vs Expectation

Solution

git reset HEAD^
git checkout pushed
git revert pushed

Moving Around

  1. Cherry-pick Intro

In this level, we are required to utilize the cherry picking feature of Git to solve the levels.

Usage of cherry pick is like that git cherry-pick <Commit1> <Commit2> <...> it copies the selected commits to your HEAD.

Given vs Expectation

Solution

git cherry-pick C3 C4 C7

2. Git Interactive Rebase

Interactive rebase is commanded as rebase -i so in this level we will be using interactive rebase to add or drop previous commits according to our intention.

Given vs Expectation

Solution

git rebase -i C1

A Mixed Bag

1- Grabbing Just 1 Commit

Given vs Expectation

Solution

git checkout main
git cherry-pick C4

Secondary Solution

git rebase -i main
--- omit C2 and C3
git checkout main
git merge bugFix

2- Juggling Commits

Given vs Expectation

Solution

git rebase -i C1
reorder as C3 first and C2 second
git commit --amend
git rebase -i C1
reorder as C2'' first and C3' second
git checkout main
git merge C3''

3- Juggling Commits #2

Given vs Expectation

Solution

git checkout C1
git cherry-pick C2
git checkout main
git cherry-pick C2'
git cherry-pick C3

4- Git Tags

In this level, we are introduced the way to mark a specific commit for our git history. To do that, we use git tag <name> <commit>.

Given vs Expectation

Solution

git tag v1 C2
git tag v0 C1
git checkout v1

5- Git Describe

If we want to see the position of our working branch’s position relative to the closest tag we can use git describecommand.

Given vs Expectation

Solution

Output of describe command for different branches
git commit

Advanced Topics

1- Rebasing over 9000 times

Given vs Expectation

Solution

git checkout bugFix
git rebase main
git checkout side
git rebase -i bugFix
git checkout another
git rebase side
git checkout main
git merge another

2- Multiple Parents

This level checks the ability to select the other parent by utilization of ~ and ^ chaining.

Given vs Expectation

Solution

git branch bugWork HEAD~^2^

3- Branch Spaghetti

Given vs Expectation

Solution

git branch -f three HEAD~3
git rebase -i C1
git branch -f one
git checkout C1
git cherry-pick C5 C4' C3' C2'
git branch -f two
git branch -f main C5

This series will continue with remote version :) Happy coding.

--

--

Deniz Sivas

Software tester by profession, software developer by passion