task-board: A TypeScript repository from ArjunJunna

Project Overview

This project utilizes React, React Router DOM, Axios and TypeScript to create a dynamic web application focused on task management.

Click here for live preview - Task-Board

Features

Task Board layout, Drag-and-Drop functionality and Task cards.
Task metrics visualization.
Search functionality, which will search by task name from any group (Ready/In progress/Testing/Done).
Filters by assignee, filter by severity of the task.
Unique colors / badges to each task based on severity (High/Medium/Low).
Light and dark mode functionality.

Technology Stack: Leveraged React's ecosystem for its component-based architecture, React Router DOM for navigation, Axios to fetch data and TypeScript for type safety.
State Management: Utilized React's state and context API for managing global state concerning tasks and user interactions.
Styling: Incorporated plain CSS for styling.
Data Visualization: Utilized Chart.js to visually represent task metrics through bar charts.

Data Mapping to Charts: Formatting data to fit Chart.js requirements was challenging.

CRUD Functionality: Implement full CRUD operations for tasks, enabling users to create, read, update, and delete tasks.
Additional Pages: Introduce separate pages such as archives, trash, or a detailed task view.
Enhanced Modal: Develop a dedicated modal for entering task details, enhancing user experience.
Authentication & User Accounts: Incorporate user authentication for managing user-specific tasks and settings securely.
Data Persistence: Introduce backend (like a database or server) for persistent storage of tasks and user data.
Enhanced Data Visualization: Explore advanced visualization techniques or additional chart types for better insights into task metrics.