⚡ TaskFlow

TaskFlow is a premium, high-fidelity, and feature-rich Kanban / Todo application designed for developers and teams who value design elegance and peak productivity. Built by devassisthub with React 19, Vite, and Tailwind CSS, TaskFlow features a highly responsive UI, gorgeous animations, and a decoupled local-first state system.

---

✨ Key Features

• 🎨 Sleek & Harmonious UI: Curated dark mode theme with glassmorphism elements, custom animations, and a responsive mobile-friendly layout.
• 🌗 Fluid Theme Toggle: Effortless switching between deep space dark mode and clean daylight light mode.
• 🔀 Drag & Drop Organization: Powered by React Beautiful Dnd, allowing you to intuitively reorder tasks.
• 📝 Interactive Editing:
  • Inline Rename: Double-click on any task text to quickly edit it inline.
  • Detailed View: Click the pencil ✏️ button to open an advanced modal to set task priorities, due dates, and reminders.
• ☑️ Subtasks Checklist: Break down complex tasks into nested items with absolute progress indicators (e.g., 2/3 done).
• 💾 Local Storage Persistent Database: Features a simulated async database client running locally. No MongoDB database or backend setup required! Perfect for immediate local deployments.

---

📂 Project Architecture

todo-app/
├── client/                 # React + Vite frontend SPA
│   ├── src/
│   │   ├── services/
│   │   │   └── taskApi.js  # Simulated async LocalStorage client
│   │   ├── App.jsx         # Core app code & views
│   │   ├── index.css       # Tailwind entry and utility classes
│   │   └── main.jsx        # App entry point
│   ├── tailwind.config.js  # Custom theme & HSL color palette
│   └── package.json
├── server/                 # Optional server backend
└── README.md               # Documentation

---

🚀 Quick Start (Running Locally)

To launch the frontend locally, follow these simple steps:

1. Clone the repository

git clone https://github.com/devassisthub/taskflow-app.git
cd taskflow-app

2. Install Dependencies

Navigate to the client directory and install the packages (using the legacy peer deps flag to support React 19):

cd client
npm install --legacy-peer-deps

3. Spin up the Development Server

npm run dev

Your app will be live and hot-reloading at http://localhost:5173/!

---

🛠️ Stack and Technologies Used

• Vite: Next-generation frontend tooling.
• React 19: Modern declarative UI architecture.
• Tailwind CSS v3: Sleek styling with highly responsive grid systems.
• Date-Fns: Comprehensive date formatting and utilities.
• React Beautiful Dnd: Robust touch-compatible drag and drop.

---

Created with 💜 by devassisthub.