Todo List Application using React JS in Hindi | React Projects for beginners in Hindi

In this video, we'll be building a Todo app using React JS. We'll start by setting up our project and creating the basic structure of our app. Then, we'll add functionality for adding and deleting todo items. We'll also add the ability to mark items as complete. By the end of this tutorial, you'll have a fully functional Todo app that you can use to manage your own tasks. So, let's get started!
React Projects Playlist: • ReactJs Projects for b...
JavaScript Projects Playlist: • JavaScript Projects be...
CSS tricks playlist: • HTML, CSS, JavaScript ...
Learn JavaScript using Programs: • JavaScript programs fo...
Please subscribe to my channel and also follow me on other platforms:
LinkedIn: / sachin-saini-11a222130
Instagram: / computernerds_
Facebook: / computernerds1729
Source Code: github.com/sac...
#reactjsproject
#projects
#computernerds

[@sports4yoo]

Thank you for explaining well.and everything is clear now.

[@hemantaggarwal2216]

Best channel for beginners

[@malikmaam9168]

Your efforts are great. Pls make more small projects. Its great to learn

[@ankitchaurasiya529]

Nice Video with great Explanation.
love from DELHI

[@nishabhowmick888]

Please do more simple projects for beginners on react js.. your videos really helped us pls do ❤

[@Robin_biju]

I implemented this in my e-commerce project. Thanks, Bro

[@MateenMughal-w5j]

Great Teaching Style

[@atifjahangir3728]

thats great video on Todos list thanks bro

[@ponkhibaruah3422]

thankyou so much for this video. really helpful!

[@shavedhayuvarajan1379]

Vrooo thank you soo much.. And i really mean it. U made my day❤

[@computernerds]

Thanks for your feedback.

[@navjotsinghsidhu3590]

Thank u sir u solved my big problem

[@nikhildepale7784]

Best explanation🙌👍

[@ms.perfectionist2835]

Mujay issues face horaha hy can u help me my terminal is giving me errors when im using npx
Because i use to use npm in command prompt terminal

[@raunaksahu2426]

very well explianed. we need more content from your side.

[@nazranbibi]

Very well explained 🎉❤Thank you 😊

[@computernerds]

Thanks for your feedback.

[@WeDexter]

great work Sir please make more videos.

[@madhunagidi5611]

It's a great one brother! well Explained 💕❤

[@EmifirE123]

bhai apne bho achha samjhaya lekin mujhe to node-persist ka use kar ke bnana tha api ke through le me after watching full video

[@Arbazbabu033]

Complete video series bnao with project...

[@AS-xz2ni]

loved your work

[@faisalnaeem3740]

create update button and if i click on update button then then input field button also change in update button after update

[@rituyadav3545]

Well explained I am learning react and your video really helpful

[@kapilrana4043]

bhai page refresh par data na delete ho tod o list se ek baar agar add hojaye to localStorage wala concept kaise lagega isme ye batao

[@ramanarc]

great tutorial brother, very well explained!

[@programwithgoutam3556]

Code run hua bhai

[@rounaksaha2726]

Sir Can you help me with the progress bar along with the description

[@umairali2360]

very informative

[@atultilekar-gc7pl]

usefull video....👌👌💯💯💯💯💯💯

[@techmay1201]

Bhai isme edit feature bhi add karke ek video bata sakte ho?

[@farhanaziz1177]

Best for beginners

[@preranabaruah4029]

Thank you ❤

[@komal842]

Best ❤

[@vishakhadiwate7964]

Css file not available

[@Replcate]

in this you cannot edit the existing todo list item

[@AbhishekSinghRautela-u2v]

bhai yeh shortcut bata doh div>.input-container ho ni ra yeh kaise set kare apne laptop par

[@afzalguru643]

Sir page refresh ho kr task remove ho raha hai is code mai ... That's are not good page refresh nahi hona chai hai
write the code of does't page refresh.

[@computernerds]

You can store values in local storage. Then values will not be removed when the page is refreshed.

[@rajkapoor6658]

i can't find your CSS help me
🙏🙏🙏🙏

[@rashijain8327]

When i click on add button my last list is deleted

[@azizulhasan1867]

It Was nice

[@varun_sharma004]

when we refresh our page the whole list is deleted,,, can we use firebase to avoid this..
please reply

[@computernerds]

Yes, You can use. Also you can use local storage.

[@pratheekbayari4255]

​@@computernerds bro i tried using local storage but i couldn't get 😢, can you help me with that?? I'll send you the code below

[@pratheekbayari4255]

@@computernerds import React, { useState , useEffect} from 'react'
import "./App.css"
import './App.css';
import TodoInput from './components/TodoInput'
import TodoList from './components/TodoList';
function App() {
const [listTodo, setListTodo] = useState([]);
useEffect(() => {
const items = JSON.parse(localStorage.getItem('items'));
if (items) {
setListTodo(items);
}
}, []);

useEffect(() => {
localStorage.setItem('items', JSON.stringify(listTodo));
}, [listTodo]);
let addList = (inputText) => {
if(inputText===''){
alert("type something");
}
else {
setListTodo([...listTodo,inputText]);
}
}
const deleteListItem = (key)=>{
let newListTodo = [...listTodo];
newListTodo.splice(key,1)
setListTodo([...newListTodo])
}

return (



TODO

{listTodo.map((listItem,i)=>{
return(

)
})}


);
}
export default App;

[@nter_10_ment52]

osm video bro

[@CSSachinSasane]

props.addlist not working...any one help

[@computernerds]

What is the problem occuring? Check the code once and then try.

[@CSSachinSasane]

@@computernerds bro I'm trying same code but it is showing props is not defined..no-undef

[@CSSachinSasane]

Can u pls help

[@sagargholap9605]

@@CSSachinSasane Check if its 'addList' or 'addlist'. check if your naming convention is proper or not.

[@Meet1997]

@@CSSachinSasane check if you are passing array as a parameter to setTodoList

[@jatinvashist691]

Sir isme hum delete k sath sath update kse kre

[@pdp_29]

delete not working

[@triptivyas2521]

same problem

[@anish_rawat]

Good

[@ajtodream1935]

you should provide the github link so if error are there we can check

[@computernerds]

Have you checked the description?

[@ajtodream1935]

@@computernerds now i got it

[@parveen1341]

❤

[@Arbazbabu033]

Javascript and reactjs k upar

[@csengineer8819]

super bhaiya
20/09/2024

[@shikhayadav3673]

Enterkey logic not working

[@praveensharmapraveensharma2325]

All logic working please check your code

[@shikhayadav3673]

@@praveensharmapraveensharma2325
Ya , sahi ho gya tha mera

[@CrazyAshu34]

bhai edit ke lie yo bataya hin nai😢

[@adarshpandey838]

please sir ek weather app banano react js se

[@amanyadav6093]

edit ke liye liyetoh bataya hi nahi

[@mohammadmotiwala7672]

Please make a multi Language project for multiple pages using Json data ❤️

[@programwithgoutam3556]

Code run hua bhai

[@rgbloody...9145]

@@programwithgoutam3556 boring

[@abeerafazal6700]

Nai chal ra bhai

[@programwithgoutam3556]

Your code was not run

[@bilalraza9170]

Follow the convention like todoInput is wrong, TodoInput is right. Idk the reason behind it but it worked for me.

[@abeerafazal6700]

Le jate he Bahar mulk apni olad ko..phir expect krte he k Desi ban k Rahe ge .

[@PrajwalPande-gw7ph]

Not good contênt

[@computernerds]

Ok