Skip to main content

Quickstart Guide

Get up and running with Learn Git Branching in just a few minutes. This guide will walk you through accessing the application, trying your first commands, and understanding the interface.

Accessing the Application

Learn Git Branching is a 100% client-side JavaScript application with no backend required.
1

Open the Application

Visit https://learngitbranching.js.org/ in your web browser.The application launches directly in sandbox mode with a basic git repository already created.
2

Understand the Interface

You’ll see two main areas:
  • Command Line (bottom): Where you type git commands
  • Visualization (center): Visual representation of your git repository showing commits, branches, and HEAD
The initial repository starts with:
  • A root commit C0
  • One additional commit C1
  • A main branch pointing to C1
  • HEAD pointing to main (indicated by an asterisk *)

Your First Git Commands

Let’s try some basic git commands to see how the visualization updates in real-time.

Making a Commit

git commit
A commit in a git repository records a snapshot of all tracked files in your directory. In Learn Git Branching, you’ll see a new commit node (like C2) appear in the tree, and the main branch will move forward to point to it.
After running git commit, observe:
  • A new commit node appears (e.g., C2)
  • The main branch moves to point to the new commit
  • The new commit’s parent is the previous commit (C1)

Creating a Branch

Branches in git are lightweight pointers to specific commits. Let’s create one:
git branch bugFix
You’ll see:
  • A new branch label bugFix appears
  • Both main and bugFix point to the same commit
  • The asterisk * is still on main (your current branch)

Switching Branches

To work on a different branch, use git checkout:
git checkout bugFix
After switching:
  • The asterisk * moves to bugFix
  • HEAD now points to bugFix
  • Future commits will move the bugFix branch forward
The shortcut git checkout -b <branch-name> creates a new branch AND switches to it in one command!

Combining Work with Merge

Let’s see how to combine work from different branches:
# Create and switch to bugFix
git checkout -b bugFix

# Make a commit on bugFix
git commit

# Switch back to main
git checkout main

# Make a commit on main
git commit

# Merge bugFix into main
git merge bugFix
Merging creates a special commit with two parents, combining the work from both branches. You’ll see a commit with two arrows pointing to its parent commits in the visualization.

Combining Work with Rebase

Rebase is an alternative to merge that creates a linear history:
# Create and switch to bugFix
git checkout -b bugFix

# Make a commit on bugFix
git commit

# Switch back to main
git checkout main

# Make a commit on main  
git commit

# Switch to bugFix and rebase onto main
git checkout bugFix
git rebase main
Rebasing takes a set of commits, “copies” them, and places them on top of another branch. This creates a cleaner, linear commit history.

Sandbox Mode Features

By default, Learn Git Branching launches in sandbox mode. Here are essential commands:

undo

Undo the effects of your last command
undo

reset

Start over with a clean slate
reset

clear

Clear the command history from view
clear

levels

Show available learning levels
levels

Working with Remote Repositories

Simulate remote repository workflows with the git clone command:
git clone
This creates an origin remote with remote tracking branches (prefixed with o/).
1

Clone creates a remote

After running git clone, you’ll see remote branches like o/main in the visualization.
2

Practice remote commands

Try commands like:
  • git fetch - Download commits from remote
  • git pull - Fetch and merge in one command
  • git push - Upload your commits to remote
3

Simulate teamwork

Use git fakeTeamwork to simulate commits made by teammates on the remote repository.

Starting Your First Level

Once you’re comfortable with the sandbox, try structured learning:
1

View available levels

Type levels to see all available lessons and your progress.
2

Start a level

Begin with the introduction sequence:
level intro1
3

Complete the goal

Each level has a specific goal shown in the interface. Match the goal tree structure to complete the level.
4

Track your score

Levels track the number of commands you use. Try to match the optimal solution (“git golf”)!

Essential Tips

Remember: branches in git are incredibly lightweight. They’re simply pointers to a specific commit. This is why the git philosophy encourages “branch early, and branch often.”
The HEAD pointer (usually shown with an asterisk *) indicates which branch you’re currently on. Commits you make will move this branch forward.
You can always use undo to reverse a command or reset to start completely fresh. Experimentation is encouraged!
Remote tracking branches (like o/main) are local representations of the remote state. They only update when you run git fetch or git pull.

Common Command Patterns

Here are some useful command patterns you’ll use frequently:

Creating and Switching Branches

git branch newFeature
git checkout newFeature

Basic Workflow

# Create feature branch
git checkout -b feature

# Make changes
git commit
git commit

# Switch to main and merge
git checkout main
git merge feature

Remote Workflow

# Get latest from remote
git fetch

# Or fetch and merge together
git pull

# Push your changes
git push

Next Steps

Start Learning Levels

Progress through structured tutorials from intro to advanced topics

Explore Sandbox Mode

Learn about all sandbox commands and features

Remote Operations

Master working with remote repositories

Open the App

Start practicing now!

Build docs developers (and LLMs) love