Todo-list11

Welcome to the Todo-list11, a simple and intuitive web application designed to help you manage your daily tasks efficiently. This README file provides an overview of the Todo-list11, its features, how to set it up, and how to use it.

Live Demo

You can see the Todo-list11 in action at Todo-list11

Features

• Add, Filter, Sort and delete task.
• Mark test as complete.
• Persist tasks using local storage.
• User-friendly interface.

Getting Started

To get a local copy up and running on your machine, follow these simple steps:

(A) Prerequisites

Ensure you have the following installed on your computer:

• Git
• Node.js
• npm (usually comes with Node.js)

(B) Installation

1. Clone the repository:

   git clone https://github.com/your-username/Todo-list11-app.git
   cd Todo-list11

2. Install the necessary packages:

   npm install

3. Start the development server:

   npm start

   The app should now be running on http://localhost:3000.

Testing Guidence

1. Adding a Task:- Click on the "Add Task" button and enter the task details in the input field. Press Enter or click the "Add" button to add the task to your list.

2. Sorting a Task:- Arrange the task for the user requirement to your list. The following steps are:

   a). Ascending Sorting:-

   • Add multiple tasks with different text or timestamps.
   • Click on the sorting button/icon to trigger ascending sorting.
   • Verify that tasks are sorted alphabetically or chronologically from oldest to newest.

   b). Descending Sorting:-

   • Add multiple tasks with different text or timestamps.
   • Click on the sorting button/icon to trigger descending sorting.
   • Verify that tasks are sorted alphabetically or chronologically from newest to oldest.

3. Filter a Task:- Add a mix of completed and incomplete tasks. Click on the filter button/icon to toggle filtering. Verify that only completed or incomplete tasks are displayed based on the filter state.

4. Deleting a Task:- To delete a task, click on the trash can icon next to the task you wish to remove.

5. Marking a Task as Completed:- Click on the circle icon next to a task to mark it as completed. The task will be visually struck through to indicate its completion.

6. Local Storage:- Tasks are saved in the browser's local storage, ensuring data persistence even after a page refresh.

Technologies Used

• React
• JavaScript
• HTML
• CSS

Contributing 🤝

Contributions are welcome! If you'd like to contribute to this project, please follow these steps:

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

License

Distribute, modify, or use this project under the terms of the MIT License.

Authors

• @Abhishek9784

---

Thank you for using the Todo-list11. We hope it helps you stay organized and productive!