Skip to content

Latest commit

 

History

History
63 lines (42 loc) · 2.64 KB

README.md

File metadata and controls

63 lines (42 loc) · 2.64 KB

🍅 Pomotama

Remade of Pomofocus.io, a web-based Pomodoro Timer I love to boost your productivity

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.

❓ What is Pomodoro Technique

The Pomodoro Technique is a structured method that divides work into 25-minute focused sessions followed by 5-minute breaks. After completing four sessions, you take a longer break of 15-30 minutes.

pomodoro technique illustration

The Pomodoro Technique is known for its simplicity. It helps you break down tasks into manageable intervals and avoid burnout by incorporating regular breaks.

Image and text credit to flowmodor.com

✨ Features

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.

📦 Technologies

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

📚 What I Learned

  • Wireframe the app
  • Structure React projects
  • Create custom hooks
  • Explore Jotai, global state management
  • Discover Driver.js
  • Utilise Web Worker
  • Implement unit tests and component tests

🚦 Quick Start

  1. Clone the Repository: git clone https://github.com/teoh4770/Pomotama.git
  2. Navigate to Directory: cd path/to/your/clone
  3. Install Dependencies: pnpm i
  4. Start the App: pnpm run dev

📚 Contributions

Contributions are welcome! If you'd like to contribute, please check out the Contributing Guide, and feel free to open an issue or a pull request.

🍿 Demo Video

Screen.Recording.Apr.27.mov