DEV Community

nishina555
nishina555

Posted on

I have released Browser Pomodoro Timer

When I was working using the Pomodoro Technique, I wanted a service that is free from advertisements and unnecessary buttons, displaying only a simple timer for work and break sessions. With that in mind, I created a Pomodoro timer that runs in the browser.

Appearance

Default(Light)

Work Session Break Session
work_light break_light
work_light_with_session break_light_with_session

Dark

Work Session Break Session
work_dark break_dark
work_dark_with_session break_dark_with_session

Usage

When you access https://nishina555.github.io/digital-pomodoro-browser/pomodoro, the Pomodoro Timer will start.

You can customize the Pomodoro Timer's settings by adding query parameters to the above URL.

The details of the query parameters are as follows.

Query Description Type Default
work Minutes of working time number 25
break Minutes of breaking time number 5
startFrom Minutes of starting working time number 0
theme Themes of the timer light|dark light
opacity Opacity of background. The value can be set within the range of 0 to 1. number 1
displaySession Display current session(work or break). 0|1 0

For example, https://nishina555.github.io/digital-pomodoro-browser/pomodoro?work=50&break=10&startFrom=45 means a Pomodoro Timer with a work duration of 50 minutes, a break duration of 10 minutes, and the work session starting from the 45 minutes. (If the current time is 10:30, the timer will be set to start the work session at 10:45, calculated in reverse.)

Intended Usage

Simply access the provided URL on your PC or smartphone to have the Pomodoro Timer ready immediately.

Furthermore, by utilizing the opacity option to make the background transparent, you can embed the timer into a "Study with Me" live streaming screen, for instance, by loading the URL in OBS Studio.

Service Operation

As it is a niche service with minimal expected demand, I am operating it for free using GitHub Pages without acquiring a custom domain. Monetization is not currently under consideration.

Future Plans

Currently, users can modify timer settings directly by changing query parameters. If there appears to be demand, I am considering creating a user-friendly interface where users can generate a URL with query parameters automatically by simply filling out a form.

Top comments (0)