This course still contains valuable patterns in React, but doesn't cover React Hooks introduced in React 1.16.
Transcript from the "Render Prop Component & Exercise" Lesson
[00:00:02]
>> Kent C. Dodds: So our next one is number four. [COUGH]
>> Kent C. Dodds: And we've removed a whole bunch of stuff because now we're gonna get into render props. So compound components is this little thing on the side that I couldn't really fit into the rest of our exercises that build on each other.
[00:00:23] And so we're going back to the basics here with the toggle component you built in the first place. And we're gonna switch to a new API. If we look at the solution here, we're seeing we have this, button is on top. We have this toggle button here. And then we also have this other button that can toggle our component.
[00:00:45] Well, that's kind of nifty. How does that work? Well, in the API that you're going to implement, you're talking that implicit state that we were sharing with compound components and you're making it explicit. And so now the user of the component has a little more work to do.
[00:01:01] That's a couple more lines of code, but because of this, they can have a custom button, or they choose how they want to render the on and off text. They have total control over rendering. That's what you are enabling with the render prop API. And with a compound components API, this is actually not possible without exposing the context provider.
[00:01:24] And then people have to use that context provider to get things and actually, by using the context provider, you consumed a render prop API. And that was the context, the toggle context.consumer is a render prop API and you're gonna implement one of those.
>> Kent C. Dodds: Yeah, I think that's pretty much it for prep for the excercise.
[00:01:49] Does anybody have any questions before we set you loose and then have lunch?
>> Kent C. Dodds: Okay, great. So go ahead and start on this. I'm gonna reset hard. Just keep myself updated. Then you'll untoggle the final version toggle in the exercise version and then run the test.