Create A Custom Hook in React | React Hooks Tutorial
Вставка
- Опубліковано 1 гру 2024
- In this video I go over how to create a custom hook in create. We utilize 2 examples for this: A Random Color Generator, and A UseQuery Hook.
-
🚀 Learn ReactJS By Building 6 Projects: codedamn.com/l...
💻 PedroTech Discord: / discord
-
Social
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
Website: machadopedro.com
Twitter: / pedrotech_
Linkedin: / machadop1407
Instagram: / _pedro.machado_
Github: github.com/mac...
Email: machadop1407@gmail.com
Equipments I Use:
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
🌟 Algorithm Book To Pass Coding Interviews: amzn.to/2Z2CirS
🌟 Microphone: amzn.to/2MKAm4V
🌟 Keyboard: amzn.to/3tvU6ZR
🌟 HD Webcam: amzn.to/3tMpJPD
🌟 Room LED Lights: amzn.to/3a5mFGp
Tags:
Custom Hooks
Fetch
ReactJS Tutorial
ReactJS and MySQL
NodeJS Tutorial
API Tutorial
congrats on reaching your 10K subscriber goal!
Thank you so much Caleb! I remember watching your old c++ vids and I really liked them, glad to see you here!
this video was clean srsly watched bunch on this topice but this is most clear
Really appreciated for your efforts for making videos.Thanks a lot .
Great explanation Pedro! keep on moving brobro, u reaching 50k soon! 🙌
Very good.! Of all the videos I've watched, this explains in all in a simple and clear term
Excellent work you've put up there Pedro.
I mean this is just everything, if the basic is clear, complex logic can be implemented with much less efforts.
A good starting point to learn custom hooks! thank you
You are amazing dude . Keep going man❤️🤝
thank u , i finally learn how to write custom hooks
Congrats on reaching your 10k subscriber goal
(I think I was number 30-something thousand subscriber)
I admire your work
Thank you so much! This support motivates me a lot!
great as always..thank you
Thanks you for watching!
Thanks so much bro for the wonderful explanation with simple code implementation. You just saved me
Excellent work Pedro, I like the simple example followed by a real world example, good technique.
Glad you liked it! I am trying out different styles of tutorials!
Perfect tutorial!
Awesome as always. I got a question not related to this video. Its regarding the login system. Do you have a video on if the user login, will redirect to a profile page which show the logger info? if you dont, can you make a video on this topic? thank you..
Thank you! I have a video on redirecting in React, however to display users information you just have to keep the users id and pass its id through a state or a prop.
what would you recommend either custom hook as described here, useSWR or React Query?
I would recommend React-Query for most intermediate to hard projects. But if you are building something huge that will have thousands of lines of code, maybe creating ur custom fetcher is better cause you have more control over it!
Thank you 👍🏼❤️🙏
No problem 😊 Glad you liked it!
Great video.. Thanks..
Glad you liked it!
I think you need to check response before putting img src like `response?.image` request usually takes time.
Excellent Tutorial on React Custom Hooks. I found it very useFul ;-) - Thanks, Pedro
{2022-02-14}, {2023-07-12}
Glad it was helpful!
If you used that hook multiple times in your code wouldn't you need to destructure it to a different variable everytime?
Example you have 'response' but if you copied and pasted that multiple times like you did at the end wouldn't it give an error? I'm assuming you would need to make the first usehook variable response then the second like response2 etc. Am I correct about that?
Passing the request to useQuery is causing the axios to run the api request twice.. if you call the axios request from useQuery and only pass in the url to fetch, the api will only run once..
Opa Pedro
Cara, como que tu estudou inglês? Não lembro de ter ouvido uma pronuncia tão boa e uma fala tao fluida vindo de um BR. Abraços
Boa Eduardo! Eu tive a sorte de poder estudar em uma escola internacional desde cedo, por isso tenho uma pronuncia melhor que o normal kkkkkk mas obrigado por ver os videos :) Abraços
I don't know it's just giving me a blank page. Without creating a custom hook it just wrote the same code as you and tried to run it.. it created a button when ever I click on it it doesn't change color and tried creating a custom hook now it just gives me a blank page not sure why...
Thanks. Completed it and after seeing so many Indian dishes, I am hungry.
hahaha enjoy lunch
Can U just extend this video.. Where we need to get two values.. {loading: true, data:{}} ====> before loading.. And after loading ==> {loading:false, data:{real data fetched }}...
If possible can U make video in future? 🙂
I can make one in the future!
Please make on video complete hook series
Good Idea!
Waiting please complete hook series
how can I buy you coffee? Thank you for this.
click on the 'Thanks' button
use custom hook starts 9:45
Not a big deal but if you ever making a tutorial, you don't have to speed rush. Try to be slower when explaining if not this is pointless in my opinion, although respect for you effort to help others.