ToDo-List

This is a small React application for creating and editing a Todo list

General Information

• I undertook this project to getting to learn how to work with local storage in React applications
• Another aim was to solidify my understanding of how to create input forms in React application and save the user input in the state of the application

Technologies Used

• React 17.0.2

Features

• Displaying a todo list
• Adding items to the list
• Mark items as completed
• Delete items from the list
• Using local storage for the list to persist

Screenshots

Demo

Live demo here

Setup

The dependencies which are necessary to run this app can be found in the package.json file.

1. Clone the repo
2. Navigate to the project folder in the terminal and install the necessary NPM dependencies

npm install

3. Run the app typing

npm start

in your terminal and visit localhost:3000 in your browser.

Learnings

• How to work with local storage for the items on the list to persist (localstorage.getItem, localstorage.setItem)
• Implementing local storage with the help of the useEffect hook
• Creating an input form in a React application and save the input in the state of the application

Project Status

The project is basically done. I may revisit it to work on some additional features

To do

• Edit items on the list

Acknowledgements

• This project was based on this tutorial.