git, block by block

This site exists because a friend of mine kept asking if he could "rebase main" when he meant pull. He ships code every day. The git verbs just never came with pictures. So here are the pictures: commits are blocks, and blocks never move. Branches are tags floating above them. Every command plays out step by step. Chain commands together in the sandbox and share a link that replays the whole run.

The blocks are borrowed from Redstone University, a CS course rendered out of Minecraft. The course doesn't cover git yet, so this site lives next door and handles that part.

live: rebase playing itself on repeat. every page here runs like this until you grab the controls.

Start here

  1. commits & brancheswhat a commit even is, and why a branch costs 41 bytes
  2. fast-forwardthe merge that isn't one
  3. mergeone new block, two parent wires
  4. rebasecopies, not moves, and the golden rule
  5. the sandboxtype real commands, watch your own blocks

The sandbox

$ git switch -c feature
Switched to a new branch 'feature'
$ git rebase main▌
A real terminal wired to the blocks. It speaks commit, branch, switch, merge, rebase, cherry-pick, reset, revert, plus the aliases I actually use. Nothing in it can break, and share copies a link that replays your whole session keystroke by keystroke, a player piano for git, forty-branch disasters included. Open the sandbox ▸

How to read the blocks

Blocks are commits. They never move, because they can't: a commit's id is a hash of everything in it, parents included. Git never edits a commit, it only writes new ones.
mainTags are refs, git's own word for them. A branch is a movable pointer to one commit, nothing more. The red one, HEAD, is whatever you have checked out.
The torch is a change in flight: one commit's diff being replayed somewhere new. Rebase, cherry-pick, and revert are all this move.
Dashed means not quite here. Faint sketches are where new commits will land. Ghosts are abandoned commits the reflog still remembers.
Wires point at parents. A commit records the id of each parent (a merge has two) and nothing about its children. git log is a walk from HEAD, backwards along the wires.

All the animations