🚀 Tada List

A powerful to-do list application built with React and TypeScript that helps you manage tasks with categories, priorities, and visual analytics.

---

✨ Features

• ✅ Task Management — Add, complete, and delete tasks with ease
• 🏷️ Categories — Organize tasks into personal, work, shopping, health, and more
• ⚡ Priority Levels — Assign high, medium, or low priorities to tasks
• 🔍 Smart Filtering — Filter by status (all, active, completed) or category
• 📊 Task Statistics — Visual charts showing distribution of task priorities
• 💾 Persistent Storage — Your tasks remain saved after browser refresh
• 📱 Responsive Design — Works on all device sizes

---

🛠️ Tech Stack

• Frontend: React with Functional Components and Hooks
• Language: TypeScript for type safety
• Styling: CSS3 with Flexbox, animations, and transitions
• Storage: localStorage API for data persistence

---

🚀 Getting Started

Requirements

• Node.js v14+
• npm v6+

Installation

git clone <repository-url>
cd todo-app
npm install

Start Development Server

npm start

Open http://localhost:3000 to view it in your browser.

📋 Task Management

• Add tasks with category and priority
• Complete tasks with a simple checkbox click
• Delete unwanted tasks
• "Clear completed" to remove all finished tasks at once

🔍 Organization

• Filter tasks by status (All, Active, Completed)
• Filter by category using the dropdown
• Tasks automatically sort by priority level

📂 Project Structure

todo-app/
├── src/
│ ├── components/
│ │ ├── TodoList.tsx # Main task management component
│ │ └── TodoList.css # Component styles
│ ├── App.tsx # Root component
│ └── index.tsx # Entry point
└── package.json

🔮 Future Enhancements

• Due dates with calendar integration
• Subtasks for complex task management
• Drag and drop reordering
• Cloud sync with user accounts
• Dark/Light theme toggle