Exercise path · JavaScript
10 JavaScript exercises, in order
From your first line to a complete program you assembled yourself. Each exercise introduces exactly one new idea, runs in this tab, and tells you in plain language what happened.
How the path works
You never start from a blank editor. Every exercise hands you a program that already runs and asks you to change or add one thing, so the first success is minutes away and the last exercise is a program you can read top to bottom and explain. The ideas arrive in this order: output, variables, arithmetic, conditions, loops, loops and conditions, strings and formatting, arrays, putting it together, a complete program.
Run is the check. There is no separate submit button: press Run, and the output is compared with what the exercise asked for. When it is not right, the feedback is a sentence about what happened — the line that differed, or what the error means — rather than a verdict. Hints come one at a time, and the answer opens only after you have run your code at least once, because reading the answer first is how you learn nothing.
Your finished exercises and the code you last had in the editor are saved in this browser, so a half-done exercise is still there tomorrow. Nothing is uploaded and there is no account.
The exercises
- Hello, Out LoudA four-line banner with your own name inside it, put on the screen by JavaScript you ran yourself.New idea: console.log() puts text on the screen
- Name TagA bordered name-tag card carrying your own name on three of its lines, all three fed by a single value you wrote once at the top.New idea: const gives a value a name you can use again
- Party PlannerA pizza order that works itself out from the guest list: the slices wanted, the whole pizzas that covers, and the slices that spill past them.New idea: JavaScript does arithmetic, and whole-number division needs Math.floor and %
- Umbrella or NotA rain report card that holds today's forecast up against your own umbrella mark and signs off with one of two answers: take it, or leave it at home.New idea: if/else chooses between two outcomes
- CountdownA launch sequence that counts itself down from five to one, announces liftoff and draws a small rocket, with the whole countdown written as one line that runs five times.New idea: a for loop repeats an action
- The Clapping GameA count from one to twenty where every third number comes out as a clap instead, so the beat runs in a straight line down the screen.New idea: an if inside a for, decided again on every pass
- The ScoreboardA game scoreboard where every name, score and bar lands in the same column, with each row built as one piece of text that has the values sitting inside it.New idea: template literals build text with values inside it
- Packing ListA travel checklist with a banner, one tick-box line for every item sitting inside the square brackets, and a footer that counts the items without being told how many there are.New idea: an array holds several values in order, and for...of walks through them
- Rainfall WeekA seven-day rainfall chart with a bar for every day, the week added up underneath it, and the wettest of the seven days picked out by its number.New idea: a value declared with let above a loop carries a running total from pass to pass
- The Cafe TicketA printed cafe receipt: the shop name across the top, three item rows whose quantity, unit price and amount all land in straight columns, a subtotal, a service charge the program works out itself, a total, and a thank-you line.New idea: assembling a complete program out of parts you already know
After the path
The JavaScript lessons go deeper on every idea the exercises introduced, and the practice problems are the next step up: graded against hidden tests, and a genuine challenge. Everything you can practise JavaScript with on this site is gathered on the JavaScript practice hub. The same path also exists in Python, TypeScript, Java, C++, C, C#, Go, PHP, Ruby, SQL, R and Bash & the Shell.