An open API service indexing awesome lists of open source software.

https://github.com/avinashchoran/flowydoro

Flowydoro is a web-based timer application designed to help you focus and be more productive using the Flowmodoro technique. This application is built with Next.js and Tailwind CSS, and it provides a simple and intuitive interface to manage your work and break sessions.
https://github.com/avinashchoran/flowydoro

flowmodoro nextjs tailwindcss typescript

Last synced: 16 days ago
JSON representation

Flowydoro is a web-based timer application designed to help you focus and be more productive using the Flowmodoro technique. This application is built with Next.js and Tailwind CSS, and it provides a simple and intuitive interface to manage your work and break sessions.

Awesome Lists containing this project

README

          

# Flowydoro Timer

Flowydoro is a web-based timer application designed to help you focus and be more productive using the Flowmodoro technique. This application is built with Next.js and Tailwind CSS, and it provides a simple and intuitive interface to manage your work and break sessions.

***

## What is the Flowmodoro Method?

The **Flowmodoro technique** is a flexible time management method that helps maximize productivity by encouraging a state of "flow". Unlike the traditional Pomodoro Technique with its rigid 25-minute work intervals and 5-minute breaks, Flowmodoro allows for more customizable and natural work periods. You work for as long as you can maintain focus, and then take a break when you feel you need one. This makes it particularly effective for creative tasks where interruptions can be disruptive. The break time in the Flowmodoro method is often calculated based on the duration of the focus session, for example, by dividing the focus time by five.

***

## Features

* **Flowmodoro Timer**: A flexible timer that you can start and stop as you please, allowing you to work for as long as you're in a state of flow.
* **Customizable Break Times**: The break timer is calculated based on your focus time, giving you a proportional rest period.
* **Task Management**: A simple to-do list to keep track of your tasks for the day. You can add and delete tasks as you go.
* **Animated Interface**: The application features a clean and modern design with smooth animations, powered by Framer Motion.
* **Light and Dark Modes**: A theme toggler to switch between light and dark modes for your comfort.
* **Responsive Design**: The application is designed to be used on both desktop and mobile devices.
* **Tooltips**: Helpful tooltips guide you through the application's controls.

***

## Tech Stack

* [Next.js](https://nextjs.org/) - The React framework for production.
* [React](https://reactjs.org/) - A JavaScript library for building user interfaces.
* [TypeScript](https://www.typescriptlang.org/) - A typed superset of JavaScript that compiles to plain JavaScript.
* [Tailwind CSS](https://tailwindcss.com/) - A utility-first CSS framework for rapid UI development.
* [Framer Motion](https://www.framer.com/motion/) - A production-ready motion library for React.
* [Radix UI](https://www.radix-ui.com/) - A collection of unstyled, accessible, and customizable UI components.
* [Lucide React](https://lucide.dev/) - A library of simply beautiful icons.
* [Next Themes](https://github.com/pacocoursey/next-themes) - An abstraction for themes in Next.js.

***

## Getting Started

First, run the development server:

```bash
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev