To-Do List


To-Do List
2026/07/16
2026/07/23

A to-do list webapp where users can CRUD lists and todos, sort todos, and the user data is persisted even after a page refresh.

By using browser localStorage, this data persistance is possible without using cookies nor database tables nor requiring login.

localStorage is not without drawbacks - see details under Limitations.


Goal

▼

Toolkit

▼

Scope

▼

Limitations

▼

Create a new To-do list

A to-do list must have a name or title.

Help (1/4)

Screenshot of the webapp with labels linking the ordered list to specific UI elements
  1. (a) Click on the dropdown to switch lists
  2. (b) Click the [➕] plus button to create new list
  3. (c) Click the [➖] minus button to delete list
Screenshot of the webapp with labels linking the ordered list to specific UI elements
  1. (a) Click the [🗑️] trash button to delete all tasks
Screenshot of the webapp with labels linking the ordered list to specific UI elements
  1. (a) Displays statistics like total number of tasks
  2. (b) Click the [❔] question mark button to display this help message
Screenshot of the webapp with labels linking the ordered list to specific UI elements
  1. (a) Click the [🡱][🡳] arrows to reorder tasks
  2. (b) Click the [💾] save or [✏️] pencil button to begin editting a task
  3. (c) Click the [➖] minus button to delete the task
  4. (d) Click the [➕] plus button to add a new task
Total Tasks: 8