Coders Packet

TODOs LIST using local storage in JavaScript

By Arun Deepak Bang

The below TODOs LIST is implemented by making use of the local storage property in JavaScript. The front-end of this TODOs LIST is made with the help of bootstrap.

Add this bootstrap CDN to the project to make use of the bootstrap properties.

 

Add these javascript scripts to make the TODOs LIST responsive (optional)

    
    

This TODOs LIST has been made by making use of local storage. So, by making use of the local storage the values can be stored using key-value pair format. Also, the data stored will not have any expiration date. As this data has no expiration date it will be available even if the web browser is closed. Coming to the functionalities of this TODOs LIST you can add a task in the TODOs LIST by adding the title and description of the task. To add to the list click on Add to list button. When added it will be shown in the table below. There is an option for deleting the task Delete when that particular task has been done. Also, a clear list button is provided to clear the entire list when needed. This type of TODOs LIST can be used by developers in many different projects. 

OUTPUT

OUT[UT

 

Download project

Reviews Report

Submitted by Arun Deepak Bang (arunbang)

Download packets of source code on Coders Packet