Learn how to make a To-do List using HTML CSS and JavaScript

Learn how to make a To-Do List using HTML CSS and JavaScript | JavaScript Project for beginners

In this JavaScript To-do list tutorial, we will first create the UI design of To-do list using HTML CSS and then using JavaScript we will add the functionality to this To-do List. You will learn DOM Manipulation and Local Storage in JavaScript.

If you like this video, don't forget to Subscribe👍.

✔ Source Code :

✔ More HTML CSS & JavaScript Projects for beginners:

✔ Password Generator using JavaScript :
✔ Weather App using HTML CSS and JavaScript:
✔ How to build QR Code Generator in JavaScript:

✔ Video Content :
00:00 | Preview
02:26 | HTML Coding
04:55 | CSS Coding
05:23 | Adding Google Fonts
16:05 | JavaScript Coding
28:35 | Adding Delete Button in To-do List
30:25 | Adding Edit Button in To-do List
52:20 | Save To-do in Local Storage
01:04:47 | Get To-do from Local Storage
01:10:32 | Delete To-do from Local Storage
01:23:32 | Edit To-do in Local Storage
01:28:00 | Final Result

✨Tags✨
Learn how to make a To-do List using HTML CSS and JavaScript
to do list JavaScript in Hindi
to do list in JavaScript
how to make a to-do list using JavaScript
simple to do list in JavaScript
HTML CSS JavaScript project

✨Hashtags✨
#javascriptprojectsforbeginners #javascriptproject

[codetraversal]

Guys, you were telling that edit functionality is not working for local storage. I have updated the code. In the addTodo function where we were checking for the edit button, we were passing the inputBox.value to the editLocalTodos function, now we are passing the text inside p tag of the selected list item. You can refer the source code for this. It's working properly.

[Royalziddi]

love you mamm finally, I found the best channel for learning tq u

[shahfarooq]

You are great the way you teach each element, functions, and each line, I have never seen such good videos anywhere. This way we get a better understanding of what each line is performing.
thank you

[satty_boy]

Very good video have😊 thank you for this video upload

[technicalstatusmuna]

What I express your teaching style ! Your teaching style is best for beginners also ❤❤❤

[sandeepgupta]

I have seen all your videos of this series and waiting for the next video. Kept making more videos like this in this series...😊😊😊

[ShivshankarWalgawkar-mdsp]

Thanks Good video.
Coming soon continue.
Please

[ishanayyar]

well explained small small things. Thanks so much 🙏🏻

[Unknownbhai]

I have seen your 3 videos calculator, to do list and weather app all was awesome....pls make one video on good personal portfolio website

[abhishekranjan]

You'r video is just awesome.
But i need your lecture on java's project.
Please make videos on it 🙏

[hasnainnisar]

Thanks for these videos you are doing great work✨

[mahak-pvmo]

Thank You So Much Ma'am😊😊 your voice is so amazing🤗🤗

[AviiiTV]

Thank you didi for such a nice content and explanation.... we want more videos like this from you...

[mdshaqlain]

Thanks dii, just want to say we don't require to make editLocalTodo fn at last since for removing the list when we click on edit we can just pass that li to deleteTodo and when we click on edit in input box then that inputText can be pass to saveTodo.

[fahadkhan-rcjr]

Awesome! But 1 thing i noticed here you are repeating your code thats the concern everything else was brilliant. Keep it up 😊thanks

[gagansodlan]

thanks a lot mam
please make full e-commerce front end project

[umarhayatudeen]

I love your work . Please do you have a YouTube channel for English?

[ishanayyar]

is any difference between margin block end and margin bottom?

[jhonsnow]

Didi meal generator bna do plzzz ( Indian meal) using api ye wali kisi ne nhi bnai 🥺

[itssuhanisinha]

Very nice video, and it was a lit bit hard too, I was getting little confuse b/w todo and todos. Can you explain their different use in this?