JS Sketchbooksee JavaScript think ✏️
← back to phase 1

1.11 — Checkpoint: the Mad Libs machine

Checkpoint time. No new concepts — instead, one five-line program that uses everything you’ve learned in Phase 1: const and let, a reassignment, strings, a template literal, and the evaluate-first rule. First we watch it run. Then you build your own. Then — for real — you type it into an actual browser console with your own hands.

watch it happen
const hero = "Ada";
const place = "Chennai";
let power = 9000;
power = power + 1;
console.log(`${hero} of ${place} has power ${power}!`);

Lines 1–2: two const declarations. Narrate along: box borrowed, string placed, label welded on (🔒 — these never change). You can draw this in your sleep now, which is exactly the point of a checkpoint.

memoryhero 🔒"Ada"place 🔒"Chennai"power9000
under the hood

The deeper story, with the real names for things — this part is what turns “I saw it” into “I can explain it.”

Why a silly story generator, of all things? Because “Mad Libs” is secretly the shape of an enormous amount of real software: fixed template + variable data = output. A welcome email is a Mad Lib (`Hi ${name}, your order ${id} shipped`). A web page is a Mad Lib filled with database values. And — here’s your future — a test report is a Mad Lib: `Expected ${expected} but received ${actual}`. You just practiced the fundamental move of generating output from data.

Checkpoint advice, honestly meant. If any step above felt foggy, go re-run that lesson now, while the gap is small and cheap. Foggy means: you could not have predicted the output, or the 🔒 needed explaining. The phases ahead assume this one is solid, the way a building assumes its foundation. There is zero shame in a second pass. There is only expensive confusion in skipping it. (Your teach-back journal is your own textbook — reread yourself!)

your turn

🏗️ Build YOUR Mad Libs machine

Choose your values — the app writes the program, exactly as you would. Then comes the real challenge below.

✏️ Quick check 1

If line 3 used const instead of let, line 4 (the reassignment) would halt the program. Type the error’s NAME.

✏️ Quick check 2

If line 3 were let power = "9000" (in quotes), type what line 4 (power = power + 1) would make power:

✏️ Quick check 3

Type the exact string `${2 + 3}` produces:

teach it back

🗣️ Now teach it back

The grand tour: walk a friend through ALL five lines of the Mad Libs program — what the machine does at each line, using every picture you’ve collected (boxes, labels, locks, trains, slots).

Write it as if your friend is sitting next to you. Saved to your journal — future-you will use these notes to teach others.

a few sentences, minimum — you’ve got this
to remember
Template + data = output. That shape — Mad Libs — is welcome emails, web pages, and every test failure message you’ll ever write.
The five-line tour used it all: const locks, let for change, right-side-first reassignment, and ${…} slots evaluated into the string.
Phase 1 complete. 🎉 If anything felt foggy, re-run that lesson now — Phase 2 (decisions & loops) builds directly on these boxes.
next: 2.1 if / else →