To-Do-List Website

A simple and interactive To-Do List application built with React. This app allows users to add, complete, cancel, and delete tasks. It provides a clear separation between ongoing, completed, and cancelled tasks.

Features

• Add New Tasks: Easily add new tasks to the ongoing list.
• Complete Tasks: Mark tasks as completed, moving them to the completed list.
• Cancel Tasks: Move tasks to the cancelled list.
• Delete Tasks: Remove tasks from any list.
• Reorder Tasks: Move tasks up or down within the ongoing tasks list.

Installation

1. Clone the repository:

   git clone https://github.com/https-sharif/to-do-list-website.git

2. Navigate to the project directory:

   cd to-do-list-website

3. Install dependencies:

   npm install

4. Start the development server:

   npm start

5. Copy the link in the terminal and open it in you browser to see the app in action.

Usage

1. Adding Tasks:

   • Type your task into the input field and click the "Add Task" button or press Enter.

2. Managing Tasks:

   • Complete Task: Click the checkmark button next to a task to move it to the completed list.
   • Cancel Task: Click the cancel button next to a task to move it to the cancelled list.
   • Delete Task: Click the delete button next to a task to remove it from the list.
   • Reorder Tasks: Use the move up and move down buttons to reorder tasks in the ongoing list.

Technologies Used

• React: For building the user interface.
• CSS: For styling the application.

Demo

You can view the live demo here

Folder Structure

• src: Contains the source code for the application.
  • App.js: Main application component.
  • TodoList.js: Component for managing the to-do list.
  • App.css: Styles for the App component.
  • TodoList.css: Styles for the TodoList component.

Contributing

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

License

This project is licensed under the MIT License - see the LICENSE file for details.