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

Подписаться 3,4 тыс.

Просмотров 66 тыс.

50% 1

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/sachinsaini4278/Re...
#reactjsproject
#projects
#computernerds

Опубликовано:

20 янв 2023

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 73

@sports4yoo 9 месяцев назад

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

@hemantaggarwal2216 9 месяцев назад

Best channel for beginners

@ponkhibaruah3422 Год назад

thankyou so much for this video. really helpful!

@madhunagidi5611 Год назад

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

@ankitchaurasiya529 2 месяца назад

Nice Video with great Explanation. love from DELHI

@AS-xz2ni 11 месяцев назад

loved your work

@malikmaam9168 10 месяцев назад

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

@rituyadav3545 6 месяцев назад

Well explained I am learning react and your video really helpful

@Robin_biju Год назад

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

@navjotsinghsidhu3590 5 дней назад

Thank u sir u solved my big problem

@nikhildepale7784 12 дней назад

Best explanation🙌👍

@atultilekar-gc7pl Год назад

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

@shavedhayuvarajan1379 Год назад

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

@computernerds Год назад

Thanks for your feedback.

@raunaksahu2426 Год назад

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

@preranabaruah4029 9 месяцев назад

Thank you ❤

@nazranbibi 11 месяцев назад

Very well explained 🎉❤Thank you 😊

@computernerds 11 месяцев назад

Thanks for your feedback.

@umairali2360 11 дней назад

very informative

@Connect2englishacademy 9 месяцев назад

great work Sir please make more videos.

@ramanarc Год назад

great tutorial brother, very well explained!

@programwithgoutam3556 Год назад

Code run hua bhai

@farhanaziz1177 10 месяцев назад

Best for beginners

@komal842 11 месяцев назад

Best ❤

@nter_10_ment52 Год назад

osm video bro

@nishabhowmick3115 3 месяца назад

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

@azizulhasan1867 10 месяцев назад

It Was nice

@ms.perfectionist2835 10 месяцев назад

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

@Arbazbabu033 3 месяца назад

Complete video series bnao with project...

@rounaksaha2726 10 месяцев назад

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

@parveen1341 4 месяца назад

❤

@anish_rawat 11 месяцев назад

Good

@EmifirE123 8 месяцев назад

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

@kapilrana4043 3 месяца назад

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

@jatinvashist691 Год назад

Sir isme hum delete k sath sath update kse kre

@rashijain8327 Год назад

When i click on add button my last list is deleted

@vishakhadiwate7964 8 месяцев назад

Css file not available

@techmay1201 5 месяцев назад

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

@user-sw3sd6sv5c Месяц назад

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

@rajkapoor6658 9 месяцев назад

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

@Replcate 2 месяца назад

in this you cannot edit the existing todo list item

@adarshpandey838 Год назад

please sir ek weather app banano react js se

@afzalguru643 2 месяца назад

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 2 месяца назад

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

@Arbazbabu033 3 месяца назад

Javascript and reactjs k upar

@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 10 месяцев назад

@@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 10 месяцев назад

@@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;