Making sense of Higher Order Components - Advanced React course, Episode 7
ฝัง
- เผยแพร่เมื่อ 24 มี.ค. 2024
- 👉 Based on the "Advanced React" book, Chapter 7: www.advanced-react.com
🎬 Episode 7: Higher Order Components in the modern world
00:30 What's in the episode
01:01 What is a Higher Order Component
01:42 Injecting props with HOCs
02:26 Enhancing callbacks with HOCs
05:44 Enhancing lifecycle methods
06:06 Intercepting DOM events
👩🏻💻 Code examples:
1. Injecting props (theming): www.advanced-react.com/exampl...
2. Button with logging on click: www.advanced-react.com/exampl...
3. Passing data to HOC: www.advanced-react.com/exampl...
4. Logging on mount: www.advanced-react.com/exampl...
💬 Twitter: / adevnadia
💬 Linkedin: / adevnadia
![เจ้าผู้เดียว - ดิด คิตตี้ [OFFICIAL MV]](http://i.ytimg.com/vi/q0NLCYKBOTo/mqdefault.jpg)
You are the best. You deserve more views... please dont stop making videos like this...😢❤
Thank you! I'll try 😊
❤😢
I can’t thank you enough for these tutorials. They’ve been a huge help in my learning process. Your dedication to teaching is truly appreciated!
Amazing, everything is crystal clear and organized perfectly, I've learned more in these 7 lessons than in the last few years of programming with React! Nadia, thank you so much for spending your time and effort on creating these videos!
Thank you! 😊😊
Your videos are awesome. Your voice is really nice and I like the calm and friendly way you talk.
It's the kind of thing I can watch at home after a day's work and not get more tired. The videos are really easy to understand.
Don't stop making these videos, I'm learning a lot.
is it just me who is enjoying this series more than any Hollywood series?? great explanations and narration also 👌
😊
Super cool series, keep doing! Would love to see some insights into how to write good custom hooks (specially preventing re-renders with hooks including local state)
Grate content, I really wish to see these types of content more. It's really rare.
Thanks! ❤
Great work. Keep it going!!
I have been working with React from past 3 years , still I didn't know these concepts in details . You are an expert . Please keep making videos and help people . Lots of Love .
❤️
Thank you for all your videos and for your amazing book!
Amazing course! Thank you 🙏
I like your voice. Looking forward for the next lesson.
The most detailed React's videos out there!
The best video on HOC I have seen.
Thank You! You explain it so georgeously, thank you so much!
love your videos, very concise and on point
Awesome content, thank you very much !
Thank you for all this excellent content. I think your videos are useful for any level. Your videos are way more substantive than most, the way you deep dive into things and don’t just stay on the surface and just really get under the hood is extremely useful, and you explain things with an unmatched clarity and detail. I find myself going back to these videos mentally and literally all the time whenever I hit a wall. Im a professional developer and watch your videos even if they’re discussing what I already know- and still I walk away with a better understanding. Your content is top shelf. Please keep up the excellent work.
Thank you, that's so great to hear! 😊
Great content, thank you nadia
Thanks for diving deep into concepts and making such quality videos. Love from INDIA 🇮🇳
I don't usually comment but I just really want to thank you for the amazing content you created. Many of these were really helpful for me not only to revisit the concepts that I knew but they helped me to understand even better. Thank you and I really hope this series will continue!!
Thank you, glad it's useful! 😊
Awesome content! There's noting like it in whole youtube! 😊
😊😊
Nadia, well done 👏
Great, as always
😊😊
Thank you so much! Your book has been incredibly enlightening. I've gained a wealth of knowledge from it. I would greatly appreciate it if you could create more videos or perhaps develop a comprehensive React course
Actual quality courses on react are very hard to do, by the time you're finished with the work, the API and best practices change so much that you have to start over 🤣
@@developerwaypatterns You're spot on 🤣Finding reliable resources to learn React can be quite challenging. Your book covers essential topics related to React, addressing a significant need in the learning community
Would this be the best way for dinamicaly rendering header and footer for some pages and not rendering it for other pages? If not, what would be a better approach?
That really depends on the code. In most cases I would probably just pass them as props.
i am mindblown!!!!!
hey, I couldn't reproduce the example "Intercepting DOM events". I've tried several approaches, but it didn't work.
Make sure that you set focus inside the modal
Can the approach of using HOCs scale in any way? What if I need to track analytics events on many of my components, but I ALSO want some of them to intercept DOM events? If I wrap HOCs inside HOCs then it's not clear what to name them.
In this case you'd just have two HOCs - withAnalytics and withDOMInterceptor
And components that use them would be just named according to the repo's naming convention
I usually see HoCs in plain Javascript and it makes me worried if it is hard to type correctly and elegantly in TypeScript.
It is indeed quite challenging
Awesome 🎉❤ your videos are just awesome. Can you please tell me which tools are you using for creating this awesome videos, thanks
I use a lot of tools for different aspects of the video. Keynote, FinalCut pro, Canva, audio editor, screen recorder, etc. Which tool in particular you're interested in? :)
@@developerwaypatterns code editor part, step by step new code appears with fade in transition animation
@@native.ninjas keynote with magic move transitions between slides
@@developerwaypatterns ok got it thanks 🌟
Isn’t hoc and render props same?
No, very different!
Не то чтобы плохо, но очень слышно, что вы знаете русский. Англоязычные юзверы могут на изи найти инфу и нативно ее понять, как насчет делать RU контент ?
(я канешн не уверен, но вроде как ютуб позволяет добавить вторую дорожку)
Unfortunately, I don't even have the capacity to do the content in one language, not to mention two :)
Another great video. Thank u so ao much... I'm glad ur getting more subs. 1m subs is coming
😅 definitely!
Love your blog!