Level 7 · Lesson 54: Time travel with Git

What the lesson explains

Time travel. Made a mess? Go back to a save point.

Every save point. One line each: its id, then its note. On the card: git log --oneline

What you do first

Oops!. In the practice terminal, type echo oops > index.html at the prompt PS C:\Users\you\Documents\my-site>; the prompt then reads PS C:\Users\you\Documents\my-site>.

The files on the practice computer

This lesson works in one folder. At the start, Documents\my-site holds images\, ideas.txt, index.html, style.css, todo.txt.

Along the way you type echo oops > index.html, type git restore index.html, type git checkout HEAD~2, type git switch main, type echo "h1 { color: }" > style.css and type git restore style.css. Lesson 55 opens with the files just as you leave them.

What you practise

Try it, "Oops!": In the practice terminal, type echo oops > index.html at the prompt PS C:\Users\you\Documents\my-site>; the prompt then reads PS C:\Users\you\Documents\my-site>. Then: In the practice terminal, type git diff at the prompt PS C:\Users\you\Documents\my-site> and the computer answers: diff --git a/index.html b/index.html / --- a/index.html / +++ b/index.html / @@ -1,18 +1,1 @@ / -<!DOCTYPE html> / -<html> / -<head> / - <title>About me</title> / - <link rel="stylesheet" href="style.css"> / -</head> / -<body> / - <h1>Hi, I am Sam</h1> / - <p>I like coding, cats and football.</p> / - <img src="images/cat.png" alt="My cat Mittens asleep on a book"> / - <h2>My favourite things</h2> / - <ul> / - <li>Pizza</li> / - <li>Football</li> / - <li>Space</li> / - </ul> / -</body> / -</html> / +oops.

Try it, "Undo it": In the practice terminal, type git restore index.html at the prompt PS C:\Users\you\Documents\my-site>; the prompt then reads PS C:\Users\you\Documents\my-site>.

Try it, "Visit the past": In the practice terminal, type git checkout HEAD~2 at the prompt PS C:\Users\you\Documents\my-site> and the computer answers: Note: switching to 'HEAD~2'. / You are in 'detached HEAD' state: you are visiting an old save point. You can look around / and run things. To go back to now, use: git switch main / HEAD is now at 8fa9095 My About Me page. Then: In the practice terminal, type dir at the prompt PS C:\Users\you\Documents\my-site> and the computer answers: Directory: C:\Users\you\Documents\my-site / Mode Name / ---- ---- / d---- images / -a--- index.html / -a--- style.css. Then: In the practice terminal, type git switch main at the prompt PS C:\Users\you\Documents\my-site> and the computer answers: Switched to branch 'main'.

In your head, "Back in time": You visit your first save point. Is todo.txt there? The answer: "No: it was made later".

Challenge, "Rescue the style": In the practice terminal, type echo "h1 { color: }" > style.css at the prompt PS C:\Users\you\Documents\my-site>; the prompt then reads PS C:\Users\you\Documents\my-site>. Then: Bring style.css back from the last save point. Starting at PS C:\Users\you\Documents\my-site>, one way takes 1 command: git restore style.css (par: 2).

What PlayBuddy and PlayType say

PlayType: "Made a mistake? Git can take you back in time."

PlayBuddy: "Git log shows every save point, newest first."

Help in every lesson

Everything happens on a pretend computer in your browser, so nothing touches your real files. PlayBuddy and PlayType stand beside the board, cheer you on and say when it is your turn.

A green ring shows where to click the first time. After that you do it on your own, and if you slip twice the ring comes back.

Stars

The lesson has 9 things to do. Up to one slip in ten gives three stars, up to one in four gives two, and finishing always gives at least one. Stars and progress are saved in this browser only; there is no account.

About DayOneCode

DayOneCode is an independent learning site, not affiliated with or endorsed by Anthropic. Claude and Claude Code are trademarks of Anthropic.