Pomodoro timer showing a 25-minute focus session and task input

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