ravish108coder / react-task-tracker

This app will help in managing your daily tasks

React Task Tracker

A simple task tracker application built with React, featuring task management, local storage, filtering, and drag-and-drop functionality.

Table of Contents

• Overview
• Features
• Installation
• Usage
• Styling
• Responsiveness
• Local Storage
• Filtering
• Drag and Drop
• Demo
• Contributing
• License

Overview

This React Task Tracker allows users to manage tasks efficiently. Tasks are displayed in a list format with details such as task name, date added, and status.

Features

• Task List: Display a list of tasks with task name, date added, and status.
• Add Task: Add new tasks to the list with a name and date added.
• Delete Task: Remove tasks from the list.
• Mark as Completed: Toggle tasks between completed and incomplete status.
• Styling: Basic styling for a user-friendly interface.
• Responsiveness: Ensures a seamless experience on both desktop and mobile devices.
• Local Storage: Persists tasks even after page refresh.
• Filtering: Filter tasks based on their status (completed/incomplete).
• Drag and Drop: Reorder tasks with intuitive drag-and-drop functionality.

Installation

1. Clone the repository.

git clone https://github.com/your-username/react-task-tracker.git

2. Navigate to the project directory.

cd react-task-tracker

3. Install dependencies.

npm install

Usage

Run the application locally:

npm start

Access the application at http://localhost:3000 in your browser.

4. Styling The application uses basic styling to enhance the user interface. Feel free to customize the styling further as needed.

5. Responsiveness The application is designed to be responsive and works well on various screen sizes, including desktop and mobile devices.

6. Local Storage Tasks are stored in local storage, ensuring that they persist even if the page is refreshed.

7. Filtering Use the filtering functionality to view tasks based on their status (completed/incomplete).

8. Drag and Drop Tasks can be reordered using the drag-and-drop feature, providing a flexible and intuitive task management experience.

9. Demo View a live demo of the application hosted on Vercel: React Task Tracker Demo.

10. Contributing Contributions are welcome! Feel free to submit issues or pull requests.