Create A Todo List App in HTML CSS & JavaScript | Todo App in JavaScript

Create A Todo List App in HTML CSS & JavaScript | Todo App with Localhost in JavaScript

In this video, I have shown you how to create a Todo List App with Localhost in JavaScript. In this todo app, you can easily add, edit, or delete your task. There are filters button too that helps you to filter your tasks. The tasks you added on this todo app will be stored in the browser local storage so, it won't be removed on page refresh or tab close.

🗂️ Get Source Code of this Todo List App

🌐 Visit CodingNepal for helpful coding projects

⭐ Hire me on Fiverr

📷 Follow me on Instagram

🤝 Support my work with a coffee

Timestamps:
0:00 Demo of Todo App
3:24 HTML & CSS Start
18:00 JavaScript Start
18:37 Saving Tasks to Local Storage
22:30 Showing All Task from Local Storage
26:00 Updating Status of a selected Task
33:35 Deleting Selected Task from the List
35:45 Editing Selected Task of the List
40:03 Filtering Task of the List
43:56 Deleting All Tasks from the List

Music Credit:
Ikson - Anywhere [Official]

Something 'bout July (Instrumental) by RYYZN

Deep Sea by Vendredi

Ehrling - You And Me (Vlog No Copyright Music)

Jimmy Hardwind - Want Me (feat. Mike Archangelo)

[CodingNepal]

Don't forget to check out the live demo of this Todo App. Link is in the description!

[shabankhan]

Bro your just one video on “real-time chat app” made my whole carrier. ❤️ thank you so much .. lots of love and respect from India

[pelonomifinger]

Honestly the best tutorial I've watched. Thank you

[ZoyaLoenko]

This is the best Todo list tutorial. I would say it's not for beginners, but absolutely worth diving deep into it. Learned a lot about Local Storage. Without is it's much much easier of course.

[franciscojunior]

Awesome!! You are the best!! Thank you my brother.

[mariskitchen]

Amazing bro, we are appreciating your work, god bless you, please upload more content like this, we are waiting🙏🙏👏👏💓

[hwqtvfp]

Great turorilal, that's what i wanted to find. Thanks Coding Nepal!!!

[achmadfikri-bgwv]

thank you bro thanks to you I understand a little about javascript

[wakweikafelix]

Awesome tutorial! Thank you for sharing!

[IAmWaterr]

this video is perfect for a beginner to get Hands on experience on html, css, js. thanks for the putting the effort to made this.

[appleid]

I've been working with this your project and improving it a lot. You'd be amazed believe me. Add the filters under an icon. Did a reverse loop so every new to do is stacked on the older one. Also made use of content editable to improve the user experience. Put a plus button at the bottom right for adding new todos. When it is clicked a div with contenteditable set to true slides up and the user types in their to do. The difference between this and the input box you use is that with a text box you can only type in a straight line.

[nerdy.guy_yt]

Bro, your work is really awesome, dude maza aa gaya

[AnjuGupta-jylj]

Good to see the second version of the TODO list app
And we wanna see videos with your voice

[galattabroz]

Awesome! i am learning to develop some apps like this and to make websites ... and I am form india

[renegade]

So amazing, keep up the great work. :) *I did notice a minor issue that if you type a long message into the task field, it does not stay withing the assigned box, and it spreads outside of the box. Apart from that minor issue, amazing job!

[nadevnimnath]

Hi,
Your videos are really cool. Sorry for asking this. Can I upload your chat app to my own domain *with some changes*. Is it Ok for you? Finally, a super video.

[SunliteIV]

You can create nodepad online no database with php?

[commonman]

can you add reminder in todo app and share it, thanks

[justChuka]

lets discuss the errors and how we got past it here.

my p.checked wont strikethrough
console gives error on classList as undefined

[yubiroaster]

First comment.... Love from NEPAL 🇳🇵 ✌️