This is a simple Todo App built with React. It allows users to manage their tasks by adding new tasks, marking tasks as complete, and filtering tasks based on their status. The app also provides the ability to store the tasks locally, so the progress is preserved even after refreshing the page.
-
Add a new task: Users can enter task details and add them to the list.
-
Complete a task: Users can mark a task as complete by clicking on the checkbox.
-
Filter tasks: Users can toggle between "All," "Active," and "Completed" tabs to view tasks based on their status.
-
Remove tasks: Under the "Completed" tab, users can remove individual tasks by clicking on the delete icon or remove all completed tasks at once.
-
React: A JavaScript library for building user interfaces.
-
React Icons: A library that provides a collection of popular icons as React components.
To get a local copy of the project up and running, follow these steps:
- Clone the repository:
git clone https://github.com/Ibinola/todo-app
- Navigate to the project directory:
cd todo-app
- Install the dependencies:
npm install
- Start the development server:
npm start
- Open your browser and visit http://localhost:3000 to see the app in action.
-
Enter a task in the input field and click the "Add" button to add it to the list.
-
Click the checkbox next to a task to mark it as complete.
-
Use the tabs at the top to filter tasks based on their status ("All," "Active," "Completed").
-
Under the "Completed" tab, click the delete icon to remove an individual task or click the "Clear Completed" button to remove all completed tasks.
The project is licensed under the MLT License
- Icons provided by React Icons