for those who didn't understood don't try to complicate things, this is really easy, don't try to binge watch rather try things at same time when Vinod teaching us pause the video and think what he said at every 3 to 5 minutes. at first I didn't really understood the concept but in 3rd time something clicked in my mind and I was laughing at my own for just making it more complicated. he used simple JS.
Spread operator saves prev value mean how does it work.....is that like if we write for name input it will is save that in values and so on???? ......and why we write in array for keys???
since you have taken same fname and lname at every function. This is very very confusing. This is the first video which confused me. And if we need to do all this simply to get value. Don't you think simple javascript infact jquery is much much better. I have a feeling that their must be another simplest way to get and store values of form.
mene first barr video dekha to muje kuch samaj me nahi aaya ,but mene firse video dekha or sathme code karta raha tab pura video samaj me aagaya to thank you so much 😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎
This html file is a template . If you open it directly in the browser you will see an empty page You can add webfonts Meta tag or analytics to this file
Until the knowledge of this video, in the inputEvent function, we can also write the following: (e.target.name == 'fName') ? setFullName({ ...fullName, fname: e.target.value }) : setFullName({ ...fullName, lname: e.target.value }); if we don't want to use previous state of the component. Rest what thapa sir has teached us is also very good and very simple to understand. Thanks sir.
bro why cant we create a separate variable outside suppose (prevfirstname,prevlastname) and as soon as user enter something than in the change function we will do if --------------------------------- let prevfirstname,prevlastname; const change(){ if(e.target.name==="fName") prevfirstname=e.target.value; else prevlastname=e.target.value; setName({fname:prevfirstname,lname:prevlastname}); } ------------------------------------- why this don't work?
You got 1 new subscriber sir.. Bhot he informative videos hai vo bhi bhot simple tarike se. Or vo bhi 100% genuine.. Mai bhot time se UA-cam use krra hu Bhot saari videos dekhi but vo kuch kaam ki nahi rehti.. unse agar kuch comment me questions pucho to reply tak nahi karte. But aaj maine apki videos dekhi.. God promise fan ho gya hu apka.. bhot accha kaam kar rahe ho keep it up we support you 🥰🥰🥰🥰🥰 #thapaji really love you .. And thanks for this type of videos .. Sach kahu to mere paas word ni hai apki tarif ke liye.. You are the best 😋😍😍😍😍😍😍😍😍🤣🤣🤣🤣😍🤣🤣
@Abhay Pratap from internet agar aap ek do programming languages jante ho ya intermediate/master kiya h toh aap other programming language sheek sakte ho online books padkr and internet se reference lakr very easily sheek skte ho
es bnday ka concept theek nhi abi previousValue to add kr rha lakin smja nhi rha k eska kam kya hai o bhai ye previous state hai jab app fname main value add ker rhay ho to basically fist state ki value update ho rhi to phr previous state ko kasay deal kr rhay ye to smjhao r video to fazool main itna long krtay ho
Actully your called fname and lname with defining is error shows when I write like you but when I write Fullname.fname and Fullname.lname it work and its also showing error on that attribute are undefined so what's the solution?
Sir, ye values heading me show karneki koi need nahi thi, isse bohot complicated ho gaya ye. Aur previous wala to 2-3 days se try kr raha hoo bt nahi samajh aya kuch.
Return karta time hamna { } walli bracket kyu use kii hai instead of ( ) this bracket Kya object banaya hai Fullname ka ishliya kiya hai ya koi aur reason sa kiya hai
kyuki tum yaha object return kar rhe ho, aur defualt object is enclosed withing curly braces. Isiliye instead of defining an object and returning only the name of the object, thapa idhar directly object ko return kar rha. For simplicity, just imagine ki return ke bad khali ek variable ka naam hain, baki sab maat dekho tab samajh aa jayega.
sir i am facing problem on this videpo i have written same code in my machine but it's give me an error please help me sir error is object is not valid as a react child found object keys {name,password,email} if you meant to render a olletion of children use aaray instead
This video is useful but i have a doubt.. when i try this: if(name === "fname") { return { fname: event.target.value, lname: prevVal.lname, age: prevVal.age, gender: prevVal.gender } } and change the input field for second time it shows TypeError: Cannot read property 'value' of null but when i destructure the event name and value it works fine how ???
may be it's becoz u r using event.target.value under the -if condition . if we use const value=event.target.value then it will assign(store) the value just 1 time .so the value ramain same under every 'if condition' . so store the event value (event.target.value) before working under if condition
Thanks for the concept clearing video. Pls let me know how I can handle form based on radio buttons. Suppose I have two radio buttons n I have same form for both then how I will manage state n post data for each radio button info.
Hi Mr Thapa, I am getting an error when using const [fullName,setfullName] = useState({ fname:"", lname:"" }); Objects are not valid as a React child (found: object with keys {fname, lname}). If you meant to render a collection of children, use an array instead. Please help
video ko ek do bar jarror dekhe :) ➡️ ReactJS Tutorial in Hindi 2020 Playlist Link: ua-cam.com/play/PLwGdqUZWnOp3aROg4wypcRhZqJG3ajZWJ.html
React native me multiple input kse handle krege....
for those who didn't understood don't try to complicate things, this is really easy, don't try to binge watch rather try things at same time when Vinod teaching us pause the video and think what he said at every 3 to 5 minutes. at first I didn't really understood the concept but in 3rd time something clicked in my mind and I was laughing at my own for just making it more complicated. he used simple JS.
same here bro😃
Tumhare videos dekhkar mujhe web developer ki job mil gayi, thank you bro!!
Bhai meri help karde yar ........
congrats bro , where ❓
Most underrated channel of UA-cam👏
Using object destructuring will be useful in this case like-
const [values, setValues] = useState({
fname: "", lname: "", email: "",
})
const changeHandle = (event) => {
setValues({
...values, [event.target.name]: event.target.value
})
}
yeah, exactly. This is the simplest one
Spread operator saves prev value mean how does it work.....is that like if we write for name input it will is save that in values and so on???? ......and why we write in array for keys???
Even that code is also bulky, you could simply use setName(prev=>{...prev, [e.target.name]: e.target.value})
Best UA-cam channel ever
since you have taken same fname and lname at every function. This is very very confusing. This is the first video which confused me. And if we need to do all this simply to get value. Don't you think simple javascript infact jquery is much much better. I have a feeling that their must be another simplest way to get and store values of form.
There are various way ...He is trying to make comfortable with react
yeah it also confused me.. :/
@@manishdiggi231 same goes with me
same, this is maybe the first time i got bored of this tutorial.. might have to rewatch it 2/3 times to understand
Bhai tune itna complicated kardeya ye topic
sach mein
after watching 10 times and try kia and Thanks to My ALLAH aur apka mjhy samjh aaa gya
Bro pdaya toh isne tha toh isee thanks kar naa
@@divyanshchaudhary7063 any problem you have ?
@@Muhammadwaseemkha9003 har cheez m allah
mene first barr video dekha to muje kuch samaj me nahi aaya ,but mene firse video dekha or sathme code karta raha tab pura video samaj me aagaya to thank you so much 😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎😎
After watching 5 times I was able to understand awesome
ye tareef thi?
Ha tareef hi thi
Thapa brother please also cover Redux topic in this series.
Vindo sir,
A humble request you to create videos for Redux.
We want to know what is it, when and why to use it ?
Thanks
I also want to learn React with Redux...
It is created🤞🤞
This seems more complicated than previous login page
ys brdr
In this series, this is yours first little bit complicated video but still fine 😄
Sir you are awesome. You teach hard topics very easily. I appreciate all your hard work . sir your videos are always very helpful .Thank you.
This html file is a template .
If you open it directly in the browser you will see an empty page
You can add webfonts Meta tag or analytics to this file
Sir
I didn't understand single thing from this tutorial
Please make another video for Form validation in Reactjs
same
i got the 1000 like and this video cleared all of my doubt
Until the knowledge of this video, in the inputEvent function, we can also write the following:
(e.target.name == 'fName') ? setFullName({ ...fullName, fname: e.target.value }) : setFullName({ ...fullName, lname: e.target.value });
if we don't want to use previous state of the component. Rest what thapa sir has teached us is also very good and very simple to understand. Thanks sir.
bro why cant we create a separate variable outside suppose (prevfirstname,prevlastname) and as soon as user enter something than in the change function we will do if
---------------------------------
let prevfirstname,prevlastname;
const change(){
if(e.target.name==="fName")
prevfirstname=e.target.value;
else
prevlastname=e.target.value;
setName({fname:prevfirstname,lname:prevlastname});
}
-------------------------------------
why this don't work?
@@rohitrout6450 your function and if else syntax is wrong bro, syntax for function : const function = () ={}, syntax for if else : if(){}else{}
Thank you, Bhai. You teach really great💜🔥
Mast I was looking for a shorter way without creating multiple states moj krdi bhai
You got 1 new subscriber sir..
Bhot he informative videos hai vo bhi bhot simple tarike se. Or vo bhi 100% genuine..
Mai bhot time se UA-cam use krra hu
Bhot saari videos dekhi but vo kuch kaam ki nahi rehti.. unse agar kuch comment me questions pucho to reply tak nahi karte.
But aaj maine apki videos dekhi.. God promise fan ho gya hu apka.. bhot accha kaam kar rahe ho keep it up we support you 🥰🥰🥰🥰🥰
#thapaji really love you ..
And thanks for this type of videos ..
Sach kahu to mere paas word ni hai apki tarif ke liye..
You are the best
😋😍😍😍😍😍😍😍😍🤣🤣🤣🤣😍🤣🤣
Your teaching is awesome
i like the way you teach but you made this topic very complicated and difficunt to understand!
you are amazing. way of teching of u us fabulous.
bht confuse hy pehly wala tareeqa thek hy
Bhai kya Redux sikhaonge is series me?
I watched this video 2 times but didn't get the concept. should I move to the next videos ?
thank you bhaiya.. it"s really helpful ...please try to provide the source code along with the vdo.
Thapa bhai you are great 👍
Please make a coding app for Android like vs code editor please 🙏🙏
Because you know everything 😇
thapa bhai mauj krdi tumne to
from where can i get the codes of this entire series of react ?
Plz *_react_* se ek *_website_* create kre and backend programming *_Node JS_* me and database *_MongoDB_* use kre...
Sure
@Abhay Pratap NO
@Abhay Pratap from internet agar aap ek do programming languages jante ho ya intermediate/master kiya h toh aap other programming language sheek sakte ho online books padkr and internet se reference lakr very easily sheek skte ho
@Abhay Pratap hello bhai , have you learned react js and create project on it
const handleChange = (e) => {
setformData(prevFormData => {
return{
...prevFormData,
[e.target.name]: e.target.value
}
})
}
Loved the way you teach 👍
ye video 2 times kyun add kiya playlist mein.
39 and 40 are same videos.
please remove 40th no video from playlist
es bnday ka concept theek nhi abi previousValue to add kr rha lakin smja nhi rha k eska kam kya hai o bhai ye previous state hai jab app fname main value add ker rhay ho to basically fist state ki value update ho rhi to phr previous state ko kasay deal kr rhay ye to smjhao r video to fazool main itna long krtay ho
@@rashidarani3674 watch on 1.25x speed
Or 1.5x speed don't waste time
Bahot complicated tha smjh jb aane laga to fir kuch aesa bata diya ki confused ho gye
abi tk ke sare video smjh agye.but ye wali video hadd se zyada confusing hai
Thapa Bhai how to limit number type input box length so that it will take only 2 digits not more than that? In ReactJs
bhai source code ke naam pe tumne apne website ki link de rakhi hai
to banda source code kaise dhundega
watched video 4 tiimes... coded same...ERROR : TypeError: Cannot read properties of undefined (reading 'fname')
Please anyone can help?
I have inut field and i need to print the input value in table column when user press enter key. Plz sir send me tips to solve this problem
its more complicated i expecting much better but itsmore difficult than prevoius one...
watch this video 3 time and practice 1time and analize 2 time it will easy
( hmr waiting for update signal from wds...) i am getting this message on my console. Can you suggest me any solution?
This video is very confusing 😵😵😵😵
But l love your content
Thapa bhai zoom to the starting me hi kar diya karo, mobile me easy rehta hai dekhna aura samjhna, thanks
Thanks sir ji❤️🤗 Awesome
bhai ye last se same kaise hai?last me button pe click pe ho rha tha aur ye aisa login form kha hota har jgh to click pe hi hota
Actully your called fname and lname with defining is error shows when I write like you
but when I write Fullname.fname and Fullname.lname it work and its also showing error on that attribute are undefined so what's the solution?
h1
आग है तू भाई
#Enjoying a lot ...........
Thank you so much for this video.
Error: Cannot read properties of undefined (reading 'fname')
Please help
same problem
sir what if we have to show data on submit button ?
Sir, ye values heading me show karneki koi need nahi thi, isse bohot complicated ho gaya ye. Aur previous wala to 2-3 days se try kr raha hoo bt nahi samajh aya kuch.
It is difficult plz make one more on it with details
2-3 bar dekh samjh jayega bro
Please make tutorial on React native 🙏🙏🙏 hma sirf apki smjh ati
Hi can we write the code without "value" attribute ?? is it necessary to use ???
Value attribute is very important if you want to create login forms.
Return karta time hamna { } walli bracket kyu use kii hai instead of ( ) this bracket
Kya object banaya hai Fullname ka ishliya kiya hai ya koi aur reason sa kiya hai
Please answer me
kyuki tum yaha object return kar rhe ho, aur defualt object is enclosed withing curly braces. Isiliye instead of defining an object and returning only the name of the object, thapa idhar directly object ko return kar rha. For simplicity, just imagine ki return ke bad khali ek variable ka naam hain, baki sab maat dekho tab samajh aa jayega.
sir i am facing problem on this videpo i have written same code in my machine but it's give me an error please help me sir
error is
object is not valid as a react child
found object keys {name,password,email} if you meant to render a olletion of children use aaray instead
Rahul Gupta hello bro 1 year ho gya is comment ko . react js acche se sikh gye ya nahi plz reply
Mix-Veg video, could've used a better naming convention!
video num 39 & 40 from react playlist are the same.
Awesome 💓
Good video
first time complex laga muje 😅😅😅😅😅
WATCH THIS VIDEO, ONE MORE TIME.
EVERYTHING WILL BE FINE.
Bhai last me input me value vala attribute uncomment kyu kiya, itne same name k variables hai..can anybody explain..@Thapa
Very complicated sir.
nice explanation
This video is useful but i have a doubt..
when i try this: if(name === "fname")
{
return {
fname: event.target.value,
lname: prevVal.lname,
age: prevVal.age,
gender: prevVal.gender
}
}
and change the input field for second time it shows TypeError: Cannot read property 'value' of null but when i destructure the event name and value it works fine how ???
may be it's becoz u r using event.target.value under the -if condition . if we use
const value=event.target.value
then it will assign(store) the value just 1 time .so the value ramain same under every 'if condition' . so store the event value (event.target.value) before working under if condition
Thanks for the concept clearing video.
Pls let me know how I can handle form based on radio buttons.
Suppose I have two radio buttons n I have same form for both then how I will manage state n post data for each radio button info.
I can't see hooks state in react developer tools...Anybody else facing the same problem?
before running npm start
use npm run build
bhai select tag ko kese tag kare wo state in nahi aa raha hai
thank you so much sir
This is the first video which confused me
Mee to brother.
vinod sir , please make playlist on react redux
Please java in one video 🇮🇳🇮🇳🇮🇳
Nice Explanation, but why are you using "const" keyword everywhere, we have "let" keyword also !!!!!!!!!!!!!!!!!!!!!!!!
ok forms ka data ko store kaise karege backend pe....
how your code automatically indented when you hit ctrl+s,
use extension name : prettier
multiple select option ki value kasy get karen gy?????????????????
zabardast
Sir ye prevalue.lname me error bata raha hai .
Pls help.
18:28 me.
Same here bro.
@@rahul-java-dev to fir apne correct kaise kiya .
Wo code apka run kiya ya nahi agar kiya to kaise .
Pls tell.
@@anupsrivashtava2676 Sorry yaar...hmse bhi nhi hua.. bs code complete kr diye.
@@rahul-java-dev agar ho to pls batana .
Try karna to .
@@anupsrivashtava2676
if(name === "fName") {
return{
fname : value,
lname : preValue.lname,
email : preValue.email,
phone : preValue.phone,
};
}
Note : return ke baad curly braces usi line me hone chahiye.
if(name === "fName") {
return
{
fname : value,
lname : preValue.lname,
email : preValue.email,
phone : preValue.phone,
};
}
Ye galat hai. Unreachable code ka error aa rha tha is'se n.
Bro can you display this data in a table?
please make a video on sidebar with hamburger menu...
When I type inside input field it disappears
Thanks sir
Sir apne fat arrow function banaya fir hata kar curly braces use kiya ye thora confusing hai .
Help any one.
Sayd wha glti ho rhi thi, islye video edit kiya gya and next time unhone ek object bnaya.
@@rahul-java-dev may usi ke karan galti ho raha ho
Thanks..broo
In my browser it's showing like below
U r awesome
Repeated many times par kuch smjh ni aya
Throwing error when I type last name-- cannot read property fname of undefined
I am facing the same error!
Kya baat hai
source code ko sperate rakha rako plz , milta nahi hai
dronacharya Award kb mil rha hai apko
Getting error objects are not as a react child fname and lastname inside useState function
Reply please
Check your return there you would be returning object rather than its value eg: fullname.fame not fullname
Hi Mr Thapa,
I am getting an error when using
const [fullName,setfullName] = useState({
fname:"",
lname:""
});
Objects are not valid as a React child (found: object with keys {fname, lname}). If you meant to render a collection of children, use an array instead.
Please help
May be you are declaring state inside return function
May be change you extension js to jsx