Check out a free preview of the full Complete Intro to React, v5 course:
The "Hooks Review and Q&A" Lesson is part of the full, Complete Intro to React, v5 course featured in this preview video. Here's what you'd learn in this lesson:

Brian clarifies why a variable isn't a dependency of the effect hook, and answers a question about why hooks were created to replace other lifestyle components. A clarification is made about how the propagation of state is given for free in hooks. Which hooks to focus on is also discussed.

Get Unlimited Access Now

Transcript from the "Hooks Review and Q&A" Lesson

[00:00:00]
>> Speaker 1: So why is breeds not a dependency?
>> Brian Holt: So breeds, as in this breeds right here.
>> Brian Holt: Is not a dependency. I guess this is kind of misnamed right here, breeds right there. We could call this breeds, like API breeds or something like that
>> Brian Holt: There we go.

[00:00:24] So that could've been confusing to you before. It doesn't depend on breeds because this breeds is not used anywhere inside of this useEffect right here. It's not read from anywhere inside of this effect, right? Now set breeds is, right? So that's why this is in here. But API, I just want you to keep in mind this breeds and that breeds are separate.

[00:00:49] They're different things, right? So this is never used inside of use effect so therefore it's not dependent on.
>> Brian Holt: Yeah?
>> Speaker 1: Was there any problem with component did not amount those life cycle methods? Why did hooks get created?
>> Brian Holt: Well, okay.
>> Speaker 1: [COUGH]
>> Brian Holt: There's a belief that hooks are simpler than having to learn the life cycle of components and having to understand like context and some other things like that.

[00:01:26] And you can notice I'm being non-committal with my language. It's because I have my doubts about which of these APIs is gonna be for the better, and like maybe we'll address that a bit later when we talk about class components. That's probably the better so that everyone can kind of get on the same page here.

[00:01:43] But the short answer to that is people think that this is easier, and then I'll teach you both, and you can be the judge of which one you want to use. But no, there's no there's no inherent problem with class components.
>> Brian Holt: There's no limitations. Actually, class components can do more than hooks can.

[00:02:03]
>> Speaker 1: Currently
>> Brian Holt: Currently. They have plans to fix the gaps, but as of right now there's still some things that hooks can't do. So one more thing we should call it that we did here. So if I go and select like American Eskimo dog and then switch to Cat, notice it very quickly switches that back to be the default option, right?

[00:02:27] That's something that we did here with this empty string.
>> Brian Holt: Normally it's just kind of understood, but I just wanna call out the fact that as soon as I call setBreed here to be empty string, because of the way of the reactive stretch and the way that we're thinking about this.

[00:02:45] As soon as this is set, this is synced to this animal drop down down here. Or rather the breed drop down, that as soon as I send that to empty string, it immediately updates breed right here, right? So those are connected together, we've clung that together. So now it's really cool as long as we're making sure that we're calling setBreed in the right places, that it cascades that effect down to all the places that are depending on that information, right?

[00:03:11] So that's the power of hooks and stuff like that is as long as you're playing by the React rules you get this propagation state for free. So I wanna tell you that useAffect and useState are the two primary hooks that you're gonna use. That's gonna cover about 90% of your use cases.

[00:03:33] So useState obviously the most common use effect also being quite common, and then maybe like useRef occasionally, and then there's a long tail of other hooks that you may never have to know. So we'll definitely still talk about them, we'll get into an intermediate React. I think we'll still talk about Ref in here, but that'll be it for the React life cycle of the React host and things like that.