Pomotama is a Pomodoro timer app inspired by Pomofocus.io, built with React and TypeScript. I love Pomofocus.io so much that I'm basically using it every day while doing tasks. While it's being really helpful to my productivity flow, I feel like I can improve the app to suit my need more. Therefore, I built this side project for both learning purposes and personal usage.

• Vite
• React.js
• TypeScript
• Tailwind CSS
• Testing Library
• Jotai
• Driver.js

Here's what Pomotama offers:

• Start Pomodoro Session: Just hit start, and you're off!
• Timer Indicators: Keep an eye on your time with handy indicators.
• Customise Settings: Tailor your focus and break times to your liking.
• Track Daily Tasks: Manage your to-dos effortlessly - add, remove, edit, and toggle tasks as needed.
• Estimate Finish Time: Get an estimate of the time required to complete your daily tasks.

1. Add tasks to work on today
2. Set estimate pomodoros (1 = 25min of work) for each task
3. Select a task to work on
4. Start timer and focus on the task for 25 minutes
5. Take a break for 5 minutes when the alarm rings
6. Iterate 3-5 until you finish the tasks

ℹ️ Tip: The selected task will update its estimate pomodoro number once the pomodoro timer has finished!

• Wireframing the app
• Structuring React projects
• Create custom hooks
• Exploring Jotai, global state management
• Discovering Driver.js
• Utilising Web Worker
• Implementing unit tests and component tests

• Enable customisation of background color for different timer mode
• Enable customisation of sound
• Implement user authentication for access across devices
• Introduce a reward or punishment system to incentivize focus and facilitate mindfulness

To run the project in your local environment, follow these steps:

1. Clone the repository to your local machine.
2. Run npm install or pnpm install or yarn in the project directory to install the required dependencies.
3. Run npm run start or pnpm run start or yarn start to get the project started.
4. Open http:https://localhost:5173 (or the address shown in your console) in your web browser to view the app.