A real to-do app that remembers your tasks after a refresh — built from one array, one render() function and localStorage. It teaches the idea every framework is built on: the data is the truth, and the screen is redrawn from it.
Updated 2026-09-27 21:27:44 +02:00
A working tip calculator in one HTML file, one CSS file and about 30 lines of JavaScript. Type a bill, drag the tip slider, split it between friends — and learn the pattern behind almost every web page: read the inputs, do the math, write the answer bac
Updated 2026-09-27 21:27:41 +02:00
Five stars that light up as you hover, lock in when you click, and remember your rating next time you visit. It teaches the difference between a previewed value and a committed one — the heart of most interactive widgets.
Updated 2026-09-27 21:27:37 +02:00
Show a random quote, click for another — and learn the fetch() pattern that powers real APIs, using a data file you can open and read yourself. It never shows the same quote twice in a row.
Updated 2026-09-27 21:27:20 +02:00
A pop-up done the modern way — with the browser's built-in element instead of a pile of hand-rolled JavaScript. Open it, then close it with a button, the Escape key, or a click on the dimmed backdrop.
Updated 2026-09-27 21:27:07 +02:00
Type a GitHub username and get their public profile as a card — avatar, bio, repos and followers. The cleanest first taste of talking to a real API with fetch().
Updated 2026-09-27 21:26:59 +02:00
A light/dark theme switch done the proper way — CSS variables, one attribute on <html>, and a remembered choice. It starts from the visitor's system setting and never flashes the wrong theme on load.
Updated 2026-09-27 21:26:50 +02:00
A live countdown to any moment you pick — days, hours, minutes and seconds, ticking away. It's your first look at doing something on a timer with setInterval, and at doing arithmetic with dates.
Updated 2026-09-27 21:26:40 +02:00
A tweet-style text box that counts down as you type, turns amber near the limit and red past it, fills a little progress ring, and disables the Post button once you've gone over. It teaches live feedback: one number, drawn several ways.
Updated 2026-09-27 21:26:36 +02:00