Buzzer Beater

Stay focused, Stay productive

Check it out here.

Features

1. Add any number of tasks.
2. Add name and description to each task and have control over the pomodoro time and break times.
3. Modes
   • Focus
   • Short break
   • Long break
4. Full timer functionality (start/pause) and reset timer.
5. Dark mode and other theme modes based on timer modes.

How to use

1. Visit Buzzer Beater.
2. Tasks
   • Add task name and description.
   • Set times for pomodoro and breaks.
   • Edit Task/ Delete tasks
3. Go to the particular task by clicking on it.
4. Select the mode you want.
5. Start your timer.

Learnings

• UseEffect, UseReducer, UseContext & React Router.
• Local Storage implementation.
• setInterval and it's workings.
• Custom hooks.

Built using

• React
• React Router v6
• ClutchUI component library.

Resources

• ClutchUI
• Undraw

Demo