BoilerPrompt
Windsurf

Windsurf prompt to build a to-do app

A to-do app is the quickest way to learn how Cascade handles multi-file scaffolding in Windsurf. This prompt gets you a working task list with persistence, filters, and a smoke-tested state hook, with every generated file arriving as a reviewable diff before it lands.

Last updated

Prompt
In Cascade Write mode, scaffold a React to-do app in this workspace: a Vite project with components/TaskList, components/TaskForm, and a useTasks hook that persists to localStorage under the key todo.tasks. Behaviors: add on Enter, toggle complete with a checkbox, inline edit on double click, delete with an undo toast, and a filter bar for all, active, and done. Show a short hint in the empty state and disable submit on blank titles. Keep all state in the hook; components stay presentational. Run npm run dev in the Windsurf terminal so I can check the preview, then write a smoke test for useTasks covering add, toggle, and reload persistence. Show me the per-file diff before touching anything outside src/.

Same task in other tools

Questions about this prompt

Does Cascade create all the files at once?

In Write mode it typically scaffolds the hook and both components in a single pass and presents a per-file diff. Accept files individually; if the hook looks wrong, reject just that file and ask for a revision instead of rerunning the whole prompt.

How do I adapt this for a backend-persisted list instead of localStorage?

Swap the persistence sentence for your API base URL and tell Cascade to write a fetch wrapper with optimistic updates. Keep useTasks as the single seam so the components stay untouched.

The preview works but tasks vanish on reload. What went wrong?

Usually the hook writes to localStorage on add but never rehydrates on mount, or the storage key differs between read and write. Ask Cascade to trace both call sites and keep the reload case in the smoke test so it stays fixed.

Related prompts