Pomodoro Focus Timer

Pomodoro Focus Timer alternates work sessions and breaks so a task has a clear beginning and end.

Interface

The page centers a circular countdown with Focus, Short break, and Long break modes. Timer lengths, a session count, and a focus-task list sit alongside it.

Features and use

Choose a timer mode, start or pause the countdown, reset the current mode, or skip to the next mode. Edit the focus and break lengths in minutes. Add focus tasks and check them off. Completed focus sessions increase the session count.

Data and limits

Timer lengths, completed session count, and the focus list are saved in localStorage. The active countdown resets after a page reload. There are no alarms or browser notifications.

Run locally

Use Node.js and npm, then run these commands from the project folder:

npm install
npm run dev

The app is built with React and Vite. Check the source and production build with:

npm run lint
npm run build

Deployment

The public app is published with GitHub Pages at https://a2rp.github.io/pomodoro-focus-timer/. To build and publish the current version, run:

npm run deploy

Future improvements

Ideas that are not implemented yet:

• A completion sound, desktop notifications, and daily session history.

Links

• Portfolio: https://www.ashishranjan.net
• GitHub: https://github.com/a2rp
• CodePen: https://codepen.io/ash1198
• LinkedIn: https://www.linkedin.com/in/aashishranjan
• Facebook: https://www.facebook.com/theash.ashish/
• YouTube: https://www.youtube.com/@ashishranjan-ashz?sub_confirmation=1
• Email: mailto:ash.ranjan09@gmail.com

Support

• Support: https://a2rp-donation-page.netlify.app/
• Buy Me a Coffee: https://buymeacoffee.com/ashishranjan
• Patreon: https://www.patreon.com/ashishranjan