Logo
Hong Wei

Pomodoro Timer

Focus timer. Work 25 mins, rest 5 mins. Don't burnout, steady only.

React Hooks
Framer Motion
Audio API

Situation

Maintaining focus during long coding sessions can be challenging without structured breaks. Eye pain, back pain, all come.

Task

Create a customizable timer based on the Pomodoro technique that alerts users when to work and when to rest.

Action

I used `setInterval` within a custom React Hook for precise timing. I added a circular progress indicator using SVG and Framer Motion, and integrated the Web Audio API for alerts.

Result

A distraction-free productivity tool. Work smart, not hard. Take break, drink water.

Hong Wei | Frontend Developer