title: "Todo App" page: playground-todo fetch.todos = "local:todos"

Todo App

A full CRUD app with validation, flash messages, and data persistence. Zero JavaScript.

#flash.success# #flash.error#

#errors.title#
#todo.title#
#todo.title#
☑

No todos yet. Add one above!

How It Works

Data Persistence

Todos are stored in a server-side collection with auto-generated IDs. Fetched via the local: prefix.

fetch.todos = "local:todos"

CRUD via Forms

Standard HTML forms POST to /w-action/todos with a w-action parameter for create, update, or delete.

/w-action/todos?w-action=create&w-redirect=/playground/todo

Validation

The w-validate attribute enables server-side validation. Rules are declared with HTML attributes like w-required.

<input w-required w-min="1" w-max="200">

Flash Messages

Success and error messages are stored in the session and consumed on the next page load via #flash.*# variables.

<if flash.success>#flash.success#</if>

Source Code

The entire app is a single file:

Page site/playground/todo.html — form, loop, CRUD, validation, flash