Todo App with Categories and Priority
A task management web app with categories, priority levels, due dates, and filtering. Users can organize tasks into custom categories and track completion progress with a clean, responsive interface.
Target user
Individual professionals and students who need personal task organization
Problem
People struggle to manage daily tasks across multiple contexts like work, personal, and study without a structured system that supports categorization and prioritization.
Requirements
- Create, edit, and delete tasks with title and description
- Assign tasks to custom categories with color labels
- Set priority levels (low, medium, high) and due dates
- Filter and sort tasks by category, priority, and status
- Mark tasks as complete and track completion percentage
Core technologies
React, TypeScript, localStorage
Completion criteria
Users can fully manage tasks with categories, priorities, and filtering in a responsive interface that persists data locally.
Optional extensions
- Add dark mode toggle
- Export tasks as JSON
- Add task search functionality
- Implement drag-and-drop reordering
Project phases
Phase 1: Phase 1: Core Task CRUD
Tasks: Set up React project with TypeScript, Create task data model and state management, Implement add/edit/delete task forms, Build task list display component
Phase 2: Phase 2: Categories and Priority
Tasks: Implement category creation and management, Add priority level selection, Add due date picker, Build category filter sidebar
Phase 3: Phase 3: Persistence and Polish
Tasks: Implement localStorage persistence, Add completion tracking and progress bar, Apply responsive styling, Add task search bar