all templates
Web Basics

To-Do List

Keep a list, tick things off, and have it still be there after a refresh.

The classic first app. Add items, check them done, delete them — and because it saves to your browser, your list survives a page reload. You'll meet arrays, re-rendering, and localStorage.

What's inside

  • Add, complete and delete items
  • State lives in an array; the screen re-renders from it
  • Saves to localStorage so it persists across refreshes
  • A live "items left" counter
  • Light & dark mode, no dependencies

Quickstart

$ curl -LO https://devai.io/downloads/todo-list.zip$ unzip todo-list.zip && cd todo-list$ open index.html   # or just double-click the file

Browse the code

The full source, exactly as the zip ships it.

loading…
Download .zip
loading tree…

about this tutorial

A devai.io starter tutorial — the smallest app that teaches state and persistence together.