TO-DO List using HTML, CSS and JQUERY

By Anushka Priya

A to-do list made using HTML, CSS, and JQUERY. The task to do can be added, checked out, or deleted from the list.

Requirements - 

Make sure you have VS-Code installed on your computer and you have knowledge about jquery. Make a new folder named - TO-DO List (or, according to your wish). Make two files - an HTML file and a CSS file named index.html and style.css, respectively. In this project, jQuery is used along with HTML and CSS. Open the HTML file in your browser. As soon as we make any changes or write some logic, refresh the page and check if the functionality works properly. 

jQuery is a fast, small, and feature-rich JavaScript library. jQuery is easy to use and the code written is understandable.

In our CSS file, according to our wish, the display of our project is added along with a background image. Background-image is set using the linear-gradient feature in CSS. 

There is a text box in which we write our respective task and as soon as we press enter, it goes under the incomplete task. We can add a number of tasks as we want. If the task is completed, just click on the tick on the right side and the task will be moved under the completed section with a slight fade-in and fade-out logic which is done in the index.html file. If we want the task to be removed, just click on the bin on the right side and the task will be checked out ( deleted ).

When the page is refreshed, new tasks can be added to our list (a whole new list is there).