useRef hook in reactjs | Easiest way

Welcome to a youtube channel dedicated to programming and coding related tutorials. We talk about tech, write code, discuss about cloud and devops. That’s what we do all day, all year. We roll out a lot of series and videos on our channel.
All the learning resources such as code files, documentations, articles and community discussions are available on our website:
chaicode.com/
You can find our discord link, github link etc on the above website.
Twitter/X link: x.com/hiteshdo...
Discord link: hitesh.ai/discord
Learn React with 10 projects: • Let's learn react from...
Learn Docker: • A practical guide on D...
Learn Kubernetes: • Complete Kubernetes Co...
How does a browser works: • How does a browser wor...
How nodejs works: • How node JS works | En...
Learn Redux-toolkit: • Learn Redux Toolkit in...
Learn NextJS: • Nextjs Full stack course
Learn Typescript: • Why to learn Typescript
Learn Javascript: • Welcome to new JavaScr...
Learn React Native: • React Native Mastery: ...
Learn Zustand: • React state management...
Learn Golang: • How to get started wit...

[@mazharulislam214]

after seeing so many focus based tutorial finally this was the one that helped me understand the concept clearly. Thank you very much to you.

[@arulprasad4786]

Yea...This one made lot more sense..

[@DoUSuggon]

Yes, its 2024 and many youtuber are still giving example based on focus 😂😂

[@ujjawal.pandey]

Literally cracked me up when you talked about that focus example.

[@alkhamistic]

I really really appreciate the fact you didn't do the reused 'focus' tutorials everyone copied off each other. Much appreciated.

[@VenkatGudavalli]

Netlfix style Intro should be continued 😅

[@NoOne-zu5qm]

I know sir you won't read this comment but Thank you so much sir I have completed your mern course and that gave me so much confidence in creating React and other full stack web applications. Again thank you sir from the bottom of my heart.

[@samadritsarkar2]

I was struggling with ReactJs for the last few days. Thanks for the last 2 videos. You are awesome 💯

[@chandrakantshinde6]

you know what i have never build a production ready app or any project yet but still i enjoy these videos and interestingly i'm getting almost everything what he is talking, making improvement in something is always exciting and fun. please make such great videos

[@danielakoyleek3757]

Finally i can get my head around this confusing hook. First time watching your channel but really loved the explanation. Many many thanks to you.

[@theodiclick6847]

This is the best and simplest way that I find for this hook
Thank you so much, sir.

[@phunguyeninh5707]

I really confuse when see my colleague use useRef in their code, but I got the whole ideal when watch this video. Thanks Hitesh so much

[@riversound8871]

Thanks Hitesh. Got more clear understating of useRef.

[@vaibhavsachdeva.2001]

You explain things so well and with patience. Thanks!

[@prithvimd9091]

The simplest yet the clearest video on the internet!

[@AbhisekMaitiOfficial]

Better than 500 rupee udemy course, love you sir ji

[@funshot4782]

Now, i explain many react concepts very easily to anyone, all credit goes to you. Hitesh Sir ##MyDrodhachaarya🙏🙏

[@tsdineshjai8565]

Wow ! Got to say this is one of the simplest and neat explanation a layman can understand.

[@ashishkumarsaini7192]

Thanks! I m just working on a project and need to implement useRef in that. Really helpful 😊

[@HiteshCodeLab]

Glad it was helpful!

[@pemaangyagurung848]

after going through multiple videos and not understanding the concept, there comes hitesh sir ❤❤❤

[@qasimhafeez3402]

Now I can say I know what is useRef, great work Sir

[@saikiran-ng8bp]

Now I got a clearly understanding of where we can use useref. Thank u

[@yashmengji6455]

Everytime you surprise me with your knowledge

[@ak39gaming]

was this video longer nah dude ! 20 minutes felt like 2 minutes. love your teaching style .

[@ishukhurana1779]

Completely different example used from all the other videos on youtube for useref!! Great Work. Just one ques: isn't changing the width of input box a re-render???

[@sunflair-wa]

You had me at, You have to understand it's history!

[@InderjeetSingh-zm3sf]

Thanks sir made my mind more clear about useRef() hook

[@kalidass5968]

You are always unique. Different examples are giving better idea. Very useful. Thank you!

[@tharunchowdary14]

Really loving all the content of your channel❤️

[@yashpanchal8464]

Thank you so much sir for this simple and useful video and I don't feel that video is longer.

[@akashgite4865]

Sir, please make video on useMemo() and useCallback() hook

[@rajeshbhattarai5934]

clear and concise. Loved it

[@jasper5016]

Thanks a lot Hitesh. I watched so many videos but this is the best explanation useRef can have. Thanks man!! I hope you make bigger videos and your subscribers will be very happy to watch them. :)

[@aniketjha1729]

one of the cleanest explanations one can find on the internet... ❣️❣️

[@HiteshCodeLab]

Thanks a lot 😊

[@DONGNebab]

damn , my 20mins time of my life not waste for watching this tutorial man, thank you for explaining it. . new subscriber here.

[@santana1971]

it took me a while to find a clear explanation of useRef. sure i will subscribe and follow you always mr.hitesh

[@vijayr.b.1050]

Your video covers concept and interview qns too. Thanks a lot for this video sir!

[@AshishKumar-DIYCode]

This is awesome video it clears my all doubts.

[@madhuiitb-cse]

Best video on useRef

[@arulprasad4786]

You are my Guru going forward. Dheivamey.......

[@mindbodyps]

Best tutorial on useRef, no doubt

[@niteshkushwaha9493]

Concise and complete explanation

[@letshope5646]

thanks much Hitesh....you are having an incredible teaching ability.

[@athuljyothis1951]

you are good at this

[@Lafsha]

best explanation so far

[@RiteshNEVERUNIFORM]

Thanks a lot. I now have a better understanding. Gotta say please Inculcate these philosophy part in courses too. I was disappointed by one of your course but your youtube videos seem to be more curated than courses

[@kaszapnagypeter]

Best explanation I have ever heard about useref hook!

[@venkatchalam6385]

superb explanation hitesh sir,thank u so much

[@tomasgilamoedo8301]

Excellent video bro! really appreciated

[@ameeraabed637]

thank you so much Iam enjoying when I watch your explanation 😊😊😊

[@azizulhakimashik1154]

Best Tutorial. Watched from Bangladesh :)

[@Yash-ry5wj]

Crystal Clear❤❤

[@RicheRichLive]

THE best video i have even seen

[@nabilkachar-k2n]

you explain the why of things and that what does give your channel its adventage upon others

[@ahmedmohned387]

Thank you sir for this wonderful tutorial.

[@NonBinary_Star]

Best description I've seen!

[@amolshrivastava7786]

This explanation was phenomenal. Can you explain in depth useEffect hook and all its cases?

[@justanotherfilcitizen2682]

This useRef confuses the sht out of me, after watching your vid, i now somehow understand it

[@ramganeshrg4125]

The concept is explained clearly....... thankyou bro.

[@parasmaniseth7873]

we getting into in-depth react ...nice...looking forward to the video on lifecycle component of react

[@harshavardhanteja6727]

As said in the Saturday live, thought yesterday would be live with telusko

[@garvitvanshkataria]

Great explanation and example

[@bipinmsit7380]

Great explanation @Hitesh! You simply cracked useRef :)

[@oncoding4520]

Hello :) Thank you for taking the time to explain it. It was such a great great video, but I just want to mention something that you already spoke in the beggining of the lesson. From a student perspective we usually go for longer or medium videos and 20min video its I think quite good. I refuse to see videos about 5min for each conxept. Coding is about conxepts and not syntax. You can steel code up and down but its more useful if you steel code but at least you understand the flow of the code and you can modify when you are asked. So thank you again for your work.

[@oncoding4520]

I dont hit the subscribe sorry...

[@oncoding4520]

I just make the notification ON for each video that you will upload

[@tanmayagarwal1356]

If useRef doesn't cause re-render then how the text box size got bigger, because any change in DOM Elements can only be visible when it gets re-rendered. Please correct me if I am wrong. And thanks a lot Hitesh, it was a great video with amazing explanation.

[@digvijayyamagekar7139]

That's because when we use useRef it returns a actual DOM reference and when you edit the actual DOM you don't need re render to see those changes, they are applied directly

[@Shambhabya_Medhi_]

thanks@@digvijayyamagekar7139

[@ReshmaShaik-ug5oy]

tq very much sir it was easy to understand

[@brothersumitkumar]

Awesome explanation!!! Thank you so much @Hitesh Sir! for creating such a nice video for all viewers who are learning react like me. For me the best part of the video was the summarization of whole concept in last. I changed my video playback speed to 0.75 to understand what you just said. LOL!!!

[@nevermindshort3]

Thanks for the explanation in the beginning. It was really helpful

[@alonaalona5967]

Thank you very much :) Only your video gave me understanding of useRef

[@amansarma417]

I was just wondering on how to manipulate on dom elements wola! I just got my answer thank you sir.

[@chandravardhan3725]

Sir, You are too much like my mom. You always sense it, what I want.

[@jamalashraf7957]

you are AWESOME! BEST EXPLANATION EVER!

[@ziaahmad8738]

Wao thank you very much, your videos are really helpful. I just started learning react and these videos are great help and I don't mind long videos at all 💓

[@iafofkhadze4628]

wow this is best video so far. really appreciate your help tho

[@hapatworld]

sir tagda explanation hain.

[@amarmohammed5644]

Brilliant explanation, love the detailed answer

[@usamanayab8381]

you have cleared it amazingly! 👏

[@easyfinanceexplained]

Thank You sir for this beautiful concise explanation!!!!!

[@mayanksahu5172]

Thankyou for this type of clearlity ❤️

[@RajveerSingh-yb6zq]

Absolutely Beautiful :)

[@ice12328]

Excellent explanation .

[@pavanshirguppi5261]

Good Hitesh. Keep it up.

[@sehajdeepsingh7427]

Brilliantly explained !!

[@idrissben1613]

Thank you , it was very clever!

[@pythusiast4701]

Amazing teacher

[@AtitManandhar]

Thank you for the clear explanation.

[@randomandrandomfacts]

Really needed this video. Thank you.

[@muhammad_abir]

thanks a lot.... you made it easy
please a video like this about redux.... what is the use case of redux!

[@narutokunn]

Thanks for the clear explanation

[@nabinsaud4688]

We need more ... please make More

[@itsjaysenofficial]

Great explanation!!! ❤

[@cosanostraytc1030]

Excellent tutorial man. Keep it up!!!

[@developerpranav]

Such a great explanation! Thank you sir!

[@SaurabhYadav-cf5sq]

Please make react playlist and clear all the concepts easily 😊

[@andyfer7716]

I'm confused. Useref is not supposed to render but clearly the input element is changing in width which means it was re-rendered. What am I missing?

[@mayurkeswani2312]

Re-rendering means re-loading of browser tab. If you use useState , with every change in state , your browser will re-load and all elements on that page will too re-reload.
but in useRef , that element will only re-render not browser tab.

[@andyfer7716]

@@mayurkeswani2312 I don't think that's right.

[@fariduzzamaansari1656]

When you are using useRef and do something like:
inputRef.current.style.width = "400px"
It means that you are manipulating the DOM manually, meaning, you are not causing a re-render in the React sense, although you may very well be causing a repaint or reflow. React handles all the DOM manipulations itself so that you don't have to, it handles when something should re-render through the 'state' and virtual DOM.

[@temitopeasama912]

This was lovely. Thank you!

[@sohamgodbole1587]

Awesome sir. As always.please make Video on redux or redux toolkit with demo app like todo.If possible.

[@johnosaze]

Please can you make a video on shortcuts used in VS Code

[@muditrustagi3356]

18:20 did anyone notice the console log showed width as 400, although the code to change width was sequentially after logging statement, ideally i would have expected it to show as width:100. Can anyone tell me why did that happen?

[@hi-yi7en]

Because here we log the non- primitive value thats why....

[@jdragon8184]

It's my first time learning anything from him and it's awesome
Ps:subbed already but permanent now

[@sarthem]

Great video tutorial thanks a lot!

[@tsdineshjai8565]

I was searching if I could find explanations for other Hooks, I couldn't find it . Could you kindly let me know about that ?