useEffect, useRef and useCallback with 1 project

No video

useEffect, useRef and useCallback with 1 project

Рет қаралды 291,786

Күн бұрын

Visit chaicode.com for all related materials, community help, source code etc.
Sara code yaha milta h
github.com/hit...
Discord pe yaha paaye jaate h:
""/discord
Instagram pe yaha paaye jaate h:
/ hiteshchoudharyofficial

Пікірлер: 2 100

@vikasmali9272 Жыл бұрын

This react series was amazing on the internet. I have watched more than two series on udemy but no one can explain all concepts like you. And you have made this series in hindi it is very helpful me to understand each and every concept deeply. This bonus is not enough for this awesome series but I will give you more support on upcoming videos.

@ramansworld3879 7 ай бұрын

True even i purchasded a course, but total waste of money....Nothing can beat this great series

@talhakhan4684 Ай бұрын

I don't see the point of using useCallback in this project because the only "things" which can cause re-renders are already passed as dependencies to useCallback which means passwordGenerator function is recreated on every re-render anyway and is never memoized between re-renders because nothing outside of the passed dependencies cause renders

@Sharath_Codm Ай бұрын

@@talhakhan4684 every time the component re-renders (which can happen for many reasons, such as state changes), a new instance of the passwordGenerator function is created. This can lead to performance issues, especially if the function is passed as a prop to child components, causing them to unnecessarily re-render.

@sum1t_here 9 ай бұрын

0:00 - 5:29 - introduction 5:45 - project setup 9:53 - start 9:47 - use of useState hook 14:15 - generating password (useCallback hook : Memoization) 24:15 - designing ui 32:19 - explaining check mark at radio button 33:28 - calling of password generator function 36:11 - use of useEffect hook 42:31 - copy button using useRef 50:27 - copying a range from password field 52:23 - summary

@_sarthakmisal 7 ай бұрын

POV: You got a placement from Hitesh Bhai

@malihayat8609 7 ай бұрын

Thank You!

@gopalkalawate5453 6 ай бұрын

Thanks a lot

@talhakhan4684 Ай бұрын

@believer_rajdevyadav Жыл бұрын

Sir,, My Humble Request is to Provide Us NON-STOP A Series Of Playlists 🙏🙏🙏🙏 One Playlist For ReactJS One Playlist For NodeJS One Playlist For ExpressJS One Playlist For MongoDB One Playlist For MERN Projects One Playlist For MERN Interviews Questions I wish, you gain 1M subscribers before ending of 2025 💪❤

@contentbrother360 8 ай бұрын

This is My request

@RedSpade01 8 ай бұрын

put a copywrite quick🤣🤣@@contentbrother360

@user-jq4mg7xe3j 7 ай бұрын

so jaa bhai 1M Green Tea,

@believer_rajdevyadav 7 ай бұрын

@@user-jq4mg7xe3j bhai, abhi jaga just now 😁 😇 4 months purana comment hai aur jis level ki teaching and explaining skills hain sir ki vo 1M kya 10M deserve krte hain but uno ne multiple courses ke wajah se consistency ke sath compromise kr diye nhi toh hota at least 500k, because 4 months ago, that point of time there was a lot of hiring announcement by companies. but kuch bhi ho , jaldi se 1M ka tag lagwa dete hai bol bol kr ke 🤪😇

@utkarshsingh7232 6 ай бұрын

Yes sir please, it is the most awaited playlist of playlists

@yourallfevorite953 2 ай бұрын

kya sir basic basic bol ke itna bara project bnwa diye 2 3 bar video dekhna pra lekin samajh me aa gya thanku

@abr5744 Ай бұрын

how is your progress in one month and any tips on how to optimize my learning through this playlist

@u2112 Ай бұрын

@@abr5744 first learn basics and then follow this , it'll be like cherry on top

@mdaffan.pc0 4 күн бұрын

@@abr5744 Make projects with vanilla javascript on your OWN before learning react. Take help of internet and chatGPT

@muhammadjamshed2823 Ай бұрын

Sir ik chez maine note ki hai. Ap humare brain mai andr ja k scrow open kr k chezain dal lety ho. Really amazing lecture. I revised this lecture 3 times and i was wondering k apne kitna best tariky sy kia. mai pehly 1 mint ki video dekh k seekhta ta aur ab 57 mint ki video mai apke liye duaye dil sy nikal jati hai. Love you sir and I always sharing on linkedIn your content. Thank you really thank you.

@Singhoustic 10 ай бұрын

Aajtak kisi ko nahi dekha jo itni depth mein samjhata ho... commendable 🌸🌸

@namannema3349 5 ай бұрын

watching 2nd time got more clear to the concepts sir ji 1. use Callback: used for optimization it calls the function inside it when the dependencies are changed and returns a memorized function 2.useeffect: runs the function inside it whenever the page renders first-time or dependencies are changed 3.use ref : used to give reference of selected components in our page so that functions can be performed on referenced values 💙💙💙💙💙

@talhakhan4684 Ай бұрын

@abr5744 Ай бұрын

how is your progress and any tips on how to optimize my learning through this playlist

@namannema3349 Ай бұрын

@@abr5744 my experience is good my only advice is to make some good projects and learn through it

@gauravshishodia4237 7 күн бұрын

I have seen many time this video I like it you are amazing sir thanks for making this video

@tusharmalhotra5034 Жыл бұрын

I'm really impressed with the way React JS topics are being taught in such an innovative and engaging manner. Instead of just delving into the technical aspects, you take us on a journey of exploration and hands-on learning. You found a way to make complex concepts seem approachable and exciting for us. Thanks for sharing!

@ganeshnimbare1905 7 ай бұрын

One of your greatest strengths as a teacher is your exceptional communication skills. You have a remarkable ability to convey complex ideas in a clear and understandable way, making the learning process enjoyable and effective. thank you😊

@harshgoyal4050 12 күн бұрын

This video alone took me 6 hours to complete I always like to understand evrything my biggest concern was why should we cannot use useEffect instead of useCallback but after searching and some trials and errors i know now the difference perfectly.

@jayrai18 Жыл бұрын

31:15 Hats off! To you sirji, you are making superb level of content on KZfaq. and after hearing from you that this video is made at night after completing your all-day work, my respect for you goes beyond the sky.

@tanoypaul 9 ай бұрын

No words left to say thanks sir. Just can say , you are the most right educator I've ever found. May Krishna bless you and keep you happy forever 💙

@hrithikrudra4292 Жыл бұрын

Humble request to continue the series daily,bhaiya..Your explanation is awesome..!

@sumitchavan3172 8 ай бұрын

i was creating projects without major tutorial and in little logic i was getting stuck this helpd me alot to understand this basics hooks

@ahsanaleem7295 Жыл бұрын

Your videos are great, very indepth concepts. Thank you for such organic content you are sharing with us.... I am from Pakistan btw. Enjoying your videos, getting deeper concepts of JavaScript ❤

@FLiCK5 11 ай бұрын

51:00 if anyone have problem in line no. 34 ---> in line 34 we are copying the whole password to the clipboard, because even if we give the selectionrange to (0,3)or(0,20) because that doesn't affect the writeText method , we are giving the whole password here. for this --> you can use string.splice() or string.substring() method to take the desired value

@UtkarshKarki 10 ай бұрын

yes i was facing this issue

@Ahmad_Faraz_web3Dev 4 ай бұрын

Yes i am facing the same issue ,can you provide me the code ?

@nishantshrivastava8937 2 ай бұрын

Write setSelectionRange correctly in camel case it will work

@user-ys8sl8dc8l 2 ай бұрын

but how did sirji's code worked out?

@suhanisingh8189 11 ай бұрын

Your react series is awesome Hitesh Sir. Please come up with more videos which include in-depth concepts and interview questions!❤❤

@ChaiAndCodeLover 9 ай бұрын

Yes

@puskar2957 4 ай бұрын

Yes

@PraveenKumar-24 6 ай бұрын

Namaste Guruji... this is the type of learning experience, that will develope your ability to understand what actually we are doing with features available in any libraries. your experience as a teacher helps us a lot , as you know from your experience what are the ways to teach students. we need this kind of patience and dedication in all the teaching community.

@pranaypaul6361 3 ай бұрын

The entire 57.14-minute video encapsulated a valuable lesson that would otherwise have required much more time for corresponding theory and practical analysis. Kudos to Hitesh sir for his meticulous and insightful approach to basic building block analysis.

@jatinkhatri9650 Жыл бұрын

I think we should not include setPassword in the useCallback dependency array, because when this functional component rerenders, the reference of the setPassword function would be different from the setPassword function on previous rerender. So this would again create the function. This would totally defy the reason why we are using useCallback as the function would again be created on every rerender.

@chaiaurcode Жыл бұрын

You are correct

@sayandutta2038 11 ай бұрын

@@chaiaurcode In React, the setState function retains its reference between renders, and the reference to it does not change unless the component unmounts. This behavior is consistent within the same component instance during its lifecycle. As long as the component is mounted and not unmounted, the reference to setState remains the same throughout rendering and re-rendering cycles. render, re-render is different from mounting and unmounting, right ? So, it should get retained in memory. And what you did was correct I guess, setPassword does not change ever, so mentioning it within the dependency array doesn't affect the memoization of the function at all, it is all the other dependencies that have a direct relationship with memoization. When includeCharacter and includeNumbers are toggled a new function body gets returned by useCallback. And only then the useEffect gets triggered. Please correct me, if I'm wrong. And do pin this comment so that it gets more attention.

@aakashyadav6228 8 ай бұрын

@@chaiaurcode No Hitesh, you are wrong. According to react docs, React guarantees that setState function identity is stable and won't change on re-renders. This is why it's safe to omit these functions from the useEffect or useCallback dependency list.

@aakashyadav6228 8 ай бұрын

@@sayandutta2038 You are correct brother. Your comment should be pinned. This was something, which hitesh was not able to explain correctly.

@niteshmodi5468 7 ай бұрын

@@sayandutta2038 Actually I think that useEffect triggers first, and when it calls passwordGenerator, then here memoization and all is taken into consideration. Since useEffect is also executed when length, numberallowed, charallowed changes. These are same dependencies associated with useCallback(). So passwordGenerator will create a new function.. Actually, he just wanted to explain useCallback(), that's why he has used it here. Because everytime the passwordGenerator is called a new function is created. I may be wrong.

@anuragsharma5955 11 ай бұрын

This series will blow up ...the way you teach every concept is just amazing...you just dont teach us you help us to gain confidence in what we learnt here and implement the same....All this is for free thanks a lot Sir

@raj2ps 4 ай бұрын

@YashPundhirSJ Жыл бұрын

38:19 in line 19 of the code, in each iteration of the loop, you are storing the randomly selected character from the str string to pass variable and then in next iteration you are overwriting that value. but instead, you should be appending the randomly selected character from the str string so the pass variable should hold all the random characters.

@sohiltr2310 5 ай бұрын

Yes thats what i am thinking too

@user-ys8sl8dc8l 9 күн бұрын

guys i have watched this lecture witha a gap of 20 mins in first time some things were going just above the head but in 2nd time... things got crystal clear..

@himanshu_________ Жыл бұрын

Chai aur code me apka swagat hai !

@armo992 9 ай бұрын

Hi Hitesh! For the numbersAllowed checkbox setNumbersAllowed(!numbersAllowed) should also work right? Had this doubt since setNumbersAllowed only needs to be called once. In the interview questions it was a problem of async setState fn not considering the previous value returned by setState fn itself. Thanks!

@stapleworld 2 ай бұрын

IS there anyone who is looking twice this vdo ?? or Iam I only one?

@tarunpanwar6983 2 ай бұрын

I'm looking this video in 10th time but still I'm not able to understand I think I should watch another channel

@AmanSingh-qu9vo Ай бұрын

@@tarunpanwar6983 i also looking for another channel brother

@SKNagar Ай бұрын

lol I also didn’t get it in the first go I watched other videos from KZfaq of these hooks mentioned in this video and then came back to this video Now it’s understandable

@demigod_070 Ай бұрын

Yes

@dumptruck3354 Ай бұрын

@@tarunpanwar6983 same with me man guess i have to watch other videos

@Spider-Man_67 2 ай бұрын

Thanks a lot sir, itne sare hooks ko itne ache se explain karne ke liye.

@user-rp1ou6tq7x 2 ай бұрын

I have seen many videos of hooks but could not understand them as much as I could from your video. Thank you much sir!

@ALIhasan-pz1xl 6 ай бұрын

sir apky 2024 k last tak 1 million+ subscriber ho jayen gy ku k apka quality content bht he zabrdast hai love from pakistan

@shubhamyadav3272 6 ай бұрын

Difference between UseEffect and useCallback dependencies 1.useEffect dependencies are used to call function again whenever any changes are found in dependencies 2.useCallback dependencies are used to memoize function again whenever any changes are found in dependencies

@AishaAkram-jt7fy Ай бұрын

Mazaa a gaya the way you teach us each and every way to write a clean and optimized code. Love and alot of from Pakistan.Kudos to you . One of the best react course

@Sauravkum_02 4 ай бұрын

Your teaching style amazing jitna bhi dekho kuchh new learn and concepts revised hota hi hota hai , thank You Sir❤❤❤

@mohitrajwar970 19 күн бұрын

!!!!Thank you so much sir aapki knowledge free me share karne k liye jaise aap pada rahe ho jo is field ka nahi hoga wo bhi sab samajh jayega thank thank you sir ye mere liye bahut bahut jyada helpful h

@kidsschool5721 7 ай бұрын

hitesh bhai - dont ask for the comment and likes-- aapka content aisa hai ki aapki expectation se zyada support milega , i love your content

@sainaid 3 ай бұрын

one of the best series on youtube, sir your way of explaining concepts through projects is top-notch

@AtifAslam-f7z 16 күн бұрын

Thank you for the great explanation! Your videos are super helpful and easy to follow. Keep up the awesome work! 🙌

@vimalradadiya5929 7 ай бұрын

Thank you sir 🙏for this amazing content on youtube because I rewatched this video to learn the basics of hooks

@eklavyanath17204 5 күн бұрын

very nice explaination better than any paid course thank you so much sir

@Waleedkhan-zh8hm Ай бұрын

Bahut achay se smjhaya sir ne, bahut bahut Shukriya Hitesh Sir apki efforts ko slam

@saadkashif880 6 ай бұрын

One of the Best teacher in youtube in my opinion i watch alot of coding related channels but the way he teach its just like awesome Hats off to you sir

@Vikas_Kumar_SE 7 ай бұрын

I love all the courses of your's, the way of teaching is outstanding, no one go soooo deep into the concept. I hope more such videos will come for us.

@nikhilkumarjamwal5322 20 күн бұрын

came for one hook, learnt all the hooks from this video. 🔥🔥🔥

@VikashKumar-gm6ym 4 ай бұрын

VERY EXCITED FOR THIS JOURNEY SIR

@nothing_impossible591 22 күн бұрын

Nice explanation of hooks. By making project its clear the ambiguities. Thanks sir

@DineshMandloi-p8j Ай бұрын

Thanks for all the hard work you put into these videos. Keep it up! 💪

@adamyasharma_0135 5 ай бұрын

such an important lecture ,it is so good to understand the need,working and application of hooks ,Thanks alot Hitesh Sir,the best

@RituKumari-jl1re Ай бұрын

Amazing React series. Hitesh sir your teaching is awesome. Best series on KZfaq.

@nikhitazulka9693 7 ай бұрын

Thank you so much for explaining these hooks in such an easy and interactive manner..!! Kudos to you for what you are doing for the community! 🙏

@BhuvneshSharma-q2l 2 ай бұрын

best video and the best playlist if anyone deeply want to learn concepts

@sonamjha4540 5 ай бұрын

To the point Explanation!! Just loving it. Thank you so much for such a clear and greatcontent.

@muhammadjamshed2823 Ай бұрын

One thing more. meri react mai job ho gai. as a frontend developer. Iske liye maine sirf apka content perha. Love you sir

@Floki_07i 11 күн бұрын

U have made React Js more interesting for me thank u!

@spike_with_Jerry 3 ай бұрын

Literally there is no other playlist on KZfaq that teachs you react in so depth . Just Awesome...

@RoamingRoutes-u9d Ай бұрын

I think this is the best React Library series till date . Thank you Sir....

@maullikakbari8200 2 ай бұрын

greatest in teaching field Mr Hitesh choudhry. Thank you sir for all knowledge.

@vatslalit1408 2 ай бұрын

Yes sir mazza bhi bht aaya hai or sikha bhi bht kuch hai is video me .....Thank you.....

@heyMonikaa 3 ай бұрын

What a wow series I can't thank you enough for this series, you're literally the god for all of us developers really love your work

@chaiaurcode 3 ай бұрын

Glad you enjoy it!🤗☕️

@MayankKumar-rc2dp 2 ай бұрын

Legendary way to approach react hands off 👍👍

@shubh1230 2 ай бұрын

God level teaching........worth every effort with you sir

@akashagrawal3778 Ай бұрын

sir your way of teaching is best, thankyou so much for your efforts😇😇

@jyotdelvadiya0706 Ай бұрын

passwordRef.current?.setSelectionRange(0, 3) using this line of code, We can only make a change in UI it means 3 Selected character will be shown BUT it DOESN'T means that 3 characters are copied to clipboard, Actually whole Text(Password) will be copy to the clipboard. This is what i find during tutorial... Anyways a Great series Hitesh Sir, Never seen any video in this much depth on youtube. Hatsoff to you sir for a great efforts. This really means a lot!!

@suyashshekhar3247 6 ай бұрын

Thankyou very much sir for this video and for providing in depth knowledge of how to use useEffect, useRef, useCallback and where to use.❤❤❤

@RoyHimadri1605 6 сағат бұрын

Thanks for the video sir. Well explained the use of useCallback hook.

@jaiminmakwana9535 6 ай бұрын

you proved sir , "" never judge a project by its look "" , excellent job sir... 💯💯💯💯

@im_riyaj 5 ай бұрын

was following english channel then found out this playlist and started learning in hindi...apni bhasa mein achhese samaj ata hein..😄

@ashishkumar-jo7cj 3 ай бұрын

40:40 sabse important point yahaan se start hota hai dono hook useCallBack and useEffect bhale hi same ho lekin dono ki functioning me difference hai 1. useCallback hook mainly uski dependencies ke memoisation ke liye responsible hai mainly ye methods ke refrence ko apni memory me cache krke rakhta hai taaki component rerender hone par kahi method ka refrence change na ho jae or wo ek new method ki tarah hi treat ho warna uspar depend baaki component bhi fhir se rerender honge kyuki method ka refrence (means address in the memory) change ho gya hai 2. Wahi useEffect sirf apni dependencies ke behalf par us callback function ko run karwaata agar dependencies change hui to wo useEffect ka callback bhi run hoga jisse uske ander hue task jaise yahan passwordGenerator function ko call krwaana wo invoke ho jaega. Thnk u so much sir ye sab clear krne ke liye.

@varunpareek7020 2 ай бұрын

This series is great! It is helping me a lot

@farmanali4746 5 ай бұрын

Great Job sir I realy appreciate you i gain alot of knowledge from your vedios no paid cours can teach us like you can go in the depth of the code and explain very easily with best examples

@dev-SSB 7 күн бұрын

🔥 Nicely Explained about why use hooks 🔥

@ashvinihyalij9450 3 ай бұрын

Thank you sir for sharing your knowledge in such a clear and engaging way - you're making learning React an enjoyable journey!

@usmankhan3216 Ай бұрын

thank you so much sir ....mujhe ab samajh mainn araha hai react isrf a ki videos ki wajah sy....🥰

@indpriderdx5174 Ай бұрын

kuch bol hi nahi sakta , apki teaching ke bare main , wow, too good , felling samjo bas,.....! nice thank You>>>>!

@ayushwalker9083 23 күн бұрын

It would be a shame not to leave a comment on this video before moving on to another lecture in the series. Kudos to you, sir-you're truly exceptional! 🔥🔥🔥

@guptasagar694 6 ай бұрын

Hitesh Sir, Just wanted to say that You explained all the Concepts and behind the hook intricacies very well...Kudos to you..Hatts Off

@Zareena_Iqbal 6 ай бұрын

This react series was amazing on the internet

@NM-iw4nf 7 ай бұрын

The way you teach is fantastic with great deep knowledge explaining

@AishaAkram-jt7fy 4 ай бұрын

Thanks, sir for having such an amazing approach to making complex things simple and teaching us every concept while gaining hands on experience and projects.

@faizakashaf805 2 ай бұрын

outstanding video ,bht sahi wali clarification hogye sir apki wjah sa hooks ki

@simranjain7403 5 ай бұрын

I am glad to find such an informative seriesss!!!!!!!!!!!!!!!!!!!!!!

@asheshbandopadhyay6657 6 ай бұрын

confidence a gaya he achha khasa. sukriya gurujiiii

@codemonkey10 Ай бұрын

The most under rated youtube channel For Real sir Love from Pakistan

@RxjZz 2 ай бұрын

Best video to understand React hooks❤

@sutharjay1 6 ай бұрын

In my version i have added copy copied feature where if user has copied the pwd so it will show colied but if user changes the length and number or character I will copy text again Learning with Hitesh Sir ❤❤❤

@VishalChauhan-mu8ju 2 ай бұрын

I sat down to watch this video without much interest, but by the time it reached 5:40, I became curious listening to the sir . His ability to captivate and engage with the viewer || student is absolutely remarkable ; 👍🏻🦁

@shahriarhossain8622 4 ай бұрын

Take love from Bangladesh Sir. I am learning so many things from you.

@aggsha7580 3 сағат бұрын

Thanks A Lot Sir for such Amazing Content ❤❤

@Rohithakur07 5 ай бұрын

Thankyou so much sir , I am very feeling very grateful and this is the best series on youtube , you are the best teacher in this world

@yeshathakkar2765 7 ай бұрын

It is an amazing series for beginners like me cause every concept has been explained very clearly and in-depth. Your way of making people understand the concepts is very powerful. Thank you for an excellent series on React JS.