Web Basics
Stopwatch
Start, stop, lap — accurate timing that doesn't drift.
A stopwatch with lap times that stays accurate by measuring elapsed time instead of counting ticks — the mistake most first attempts make. A tidy lesson in doing time right.
What's inside
- Start / stop / reset and lap splits
- Accurate timing from Date deltas, not tick counting
- Clean mm:ss.cs formatting
- Lap list rendered from an array
- Light & dark mode, no dependencies
Quickstart
$ curl -LO https://devai.io/downloads/stopwatch.zip$ unzip stopwatch.zip && cd stopwatch$ open index.html # or just double-click the file
about this tutorial
A devai.io starter tutorial — the right way to measure time in the browser.
More in Web Basics
view allWeb Basics
Tip Calculator
Your first interactive page: type a bill, see the tip update live.
HTMLCSSJavaScript
View template zip + preview
Web Basics
To-Do List
Keep a list, tick things off, and have it still be there after a refresh.
HTMLCSSJavaScriptlocalStorage
View template zip + preview
Web Basics
Countdown Timer
Count down to any moment — days, hours, minutes, seconds, ticking live.
HTMLCSSJavaScriptDates
View template zip + preview