StatusIn Progress
TypePractice
Updated
Stack
reacttypescriptvitest
About
A task tracking app built as a deliberate practice project — the goal is less about the feature set and more about doing React, TypeScript, and testing properly end to end.
Current focus is the core task flow: creating, completing, and filtering tasks, with Vitest coverage around the state logic before more UI gets layered on.
01The problem
Most side projects stall because the fundamentals get skipped — state gets messy, tests get skipped, and the project dies. This exists to practice doing the boring parts properly on a small, well-understood domain.
02Approach
- →Kept the domain tiny on purpose: tasks, a filter, and nothing else — so the attention goes to structure, not features.
- →State logic lives in pure, framework-free functions, which makes it trivial to test with Vitest before any UI touches it.
- →TypeScript strict mode from day one — no any, no escape hatches.
03What it does
- →Create, complete, and delete tasks
- →Filter by all / active / completed
- →Fully tested state logic with Vitest
04What I learned
- →Pure state functions first, UI second — testing becomes an afterthought in the good sense.
- →A small domain exposes sloppy habits faster than a big one.
05What's next
- →Add keyboard-driven task entry
- →Sync across tabs with the storage event
Live app
/app-todo/