React Refs Explained with Examples | React useRef Tutorial

[@CodingWithChaim]

Whats up everybody? Thanks for watching! If you enjoyed the video, please be sure to drop a like it really helps. Also, if you have not already done so, be sure to subscribe to the channel so you never miss an upload. You can subscribe here: kzbin.info

[@aruchgupta]

You're the coolest React mentor out there! Thank You. And so underrated!

[@PawanKolhe]

The best explanation of Refs I could find on KZbin. Thanks.

[@SlimAndCherryTravel]

I'm not sure what it is about these videos, but you are providing the kind of learning I've been looking for with React. I can look at tutorials all day and nothing sinks in, almost like the teacher is trying to save me from the difficult parts, but I walk away never actually knowing how the hell anything actually works. Far out man, thank you. Well done. I looks forward to more of these. In the meantime, I've got a bit of a back-catalogue of yours that I need to work through. :-)

[@ikibkilam8383]

I never really understood useRef, though I have used it a few times. This is the best explanation of what it does. Thank you very much for this awesome explanation!

[@CodingWithChaim]

Thank you!!

[@ahmed-osama2022]

Thanks a lot for explaining this concept very well, I loved you way you teach

[@smellycyborg3133]

brilliant. you're explaining everything in such good detail. and because i've been coding for a year i understand it. i'm switchign for game development to dev

[@Moon-nk7gv]

I am so lucky to find your videos! I don't think i am smart But u really make me understand almost everything you said! You are such an amazing teacher! Keep it up the good work. You have no idea potentially how many lives You are saving ❤

[@tomasgilamoedo8301]

Excellent explanation, solid and detailed! really appreciated

[@tejasnikam3287]

Keep it up bro really helpful !!! Headsup from India !!!!

[@pritulkhan1395]

You got a lot of potential with this channel, just wanna say keep it up -- you have earned a sub. Cheers from Bangladesh

[@CodingWithChaim]

Thank you! I appreciate that

[@haciendadad]

Very helpful! Thanks!

[@naveenkalburgis]

Good tutorial. Instead of using useRef for focus.. you could simply use autofocus attribute on input text JSX element for this first example.

[@girugaymesh]

I'm still kind of new to react and I only get to work on my project in my free time, so I need all the help I can get: I have a problem with useRef() that is driving me insane. I slapped a click listener onto a bunch of GenericComponent swhich attaches a "wraparound" Component to the click component. What I want to happen is: before click: after click: In my useEffect() hook, I try to access the currently clicked Wraparound- and GenericComponent, but it does not seem to catch up. Aftter my first click, the ref will be undefined. After my second click, the console output will be the first clicked element. I feel like I am not getting a crucial part about how useEffect() works here.. Any help is greatly apprecianted.

[@georgevinueza7249]

Thanks for the quality content Chaim!

[@emekaokonkwo626]

Thanks for this video by the way really needed, but so when you had "const time = useRef(Date.now())" and left the "ref={inputRef}" in the "input" tag, it still worked???

[@CandyMoney1000]

Great video man. Thank you!

[@CodingWithChaim]

You are most welcome

[@mathearts9739]

awesome explanation god bless you

[@mr.RAND5584]

I want to desttructure html on that useref coz i want to use the get element by tag name. I have multple 50s input type text dynamically created by map function.

[@r-i-ch]

Why not for the focus?

[@CodingWithChaim]

Yea that absolutely can work, but the idea is that sometimes you want to set focus to an input programmatically based on some conditions. Also, the idea of the example is more about showing that in react you need refs when you want interact with the actual dom.

[@iliketocode6986]

does this cover ref forwarding?

[@CodingWithChaim]

No I didn’t include that in the video

[@Gandolfof]

Thanks you! Awesome video explaining refs. But why don't you simply use this: useEffect(() => { const time = Date.now(); setInterval(() => { if (moment.diff(time, "minutes") > 1) { alert("you have ...") } }, 1000 * 60); }, []) Isn't it simpler and better? I don't get it why someone would prefer react refs approach over this.

[@CodingWithChaim]

This is a great question! I think maybe my example was a little lacking. The ref would be the better choice if you want access to the value in more than one place within the component. In your case it would be scoped to only within the useEffect

[@r-i-ch]

Can you change the value of a ref?

[@CodingWithChaim]

Rich Werden yes absolutely refs are completely mutable

[@simongirouxportelance4956]

I used a Ref to keep an Interval, because I didn't want multiple interval !

[@CodingWithChaim]

indeed! very good point

[@learnmaziyyah473]

FeathersJS Please

[@silicongamingm1]

nice video

[@bhavyabansal1143]

Great video, only request is to please go slow. You are very fast :)

[@romantyniv5381]

Brilliant videos. Don't unserstand why not so many subscr. People ! hit the button to subscribe ! Thank you man!

[@omrizilberstein2828]

Great video! love from israel

[@CodingWithChaim]

Thank you! I miss Israel

[@okonkwo.ify18]

Why did u keep ur face as if it’s rocket science? 😂 it’s not