The problem
Most focus timers treat tasks as an afterthought, so I wanted a timer and a small task list that could be adjusted during a work session.
What I built
- Built a React timer that supports repeating focus and break cycles without reloading the page.
- Added a task list with drag-and-drop ordering using react-beautiful-dnd.
- Changed the interface color with the active activity so the current mode is obvious at a glance.
- Kept the controls keyboard accessible and avoided a settings screen for the core flow.
What changed
- A live Pomodoro app with endless focus and break cycles.
- Tasks that can be reordered while the timer runs.
- Immediate visual feedback for focus, short break, and long break states.
What I learned
State transitions are the product. A timer feels broken if a pause, reset, or cycle change leaves the interface in an ambiguous state.
Back to all projects