CodePhilanthropist / activity-5

React Todo List App (Backbone JS imitation)

This is a simple todo list application built in React, emulating the functionality of the todo list app in Backbone JS.

Overview

This project replicates the basic features of a todo list app using React. Users can add new tasks, mark tasks as done, edit existing tasks, and delete tasks from the list.

Features

• Add new tasks: Enter a task and press 'Enter' or click the 'Add' button.
• Mark tasks as done: Click on the 'Done' button to mark a task as completed. Click 'Undo' to revert the task's completion status.
• Edit tasks: Click on the 'Edit' button to modify a task.
• Delete tasks: Click on the 'Delete' button to remove a task from the list.

Running the Project

To run this project locally, follow these steps:

Prerequisites

• Node.js should be installed on your machine.

Installation

1. Clone the repository to your local machine:

   git clone https://github.com/CodePhilanthropist/activity-5.git

2. Navigate to the project directory: cd react-todo-list-backbone-imitation

3. Install dependencies using npm or yarn: npm install

   or

   yarn install

4. Running the App Once the installation is complete, start the development server using Vite:

   npm run dev

   or

   yarn dev

   This will launch the application locally. Open your browser and visit http://localhost:3000 to view the React Todo List app.

Usage

Enter a new task in the input field and press 'Enter' or click the 'Add' button to add it to the list.
Click the 'Done' button to mark a task as completed. Click 'Undo' to revert the task's completion status.
Click the 'Edit' button to modify a task's content.
Click the 'Delete' button to remove a task from the list.

Technologies Used

React
Vite
Zustand (for state management)

Feel free to explore the codebase and make modifications as needed!