Intermediate React, v2

Intermediate React, v2 Completing the Redux Wiring


This course has been updated! We now recommend you take the Intermediate React, v5 course.

Check out a free preview of the full Intermediate React, v2 course:
The "Completing the Redux Wiring" Lesson is part of the full, Intermediate React, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Brian completes the last portion of the application with Redux.

Get Unlimited Access Now

Transcript from the "Completing the Redux Wiring" Lesson

>> Brian Holt: So we didn't fix the other page, right? So if we went back over to,
>> Brian Holt: We could just go ahead and do it really quick, in details such as, cuz it's also reading from context and context no longer exists. So we would delete that. We would import connect, from connect.

[00:00:24] Sorry, not from connect, but react-redux.
>> Brian Holt: So the context stuff down here, we would delete all of that stuff cuz we don't need it anymore.
>> Brian Holt: Right? We don't need this crazy stuff. And theme here is just gonna be props.theme. And props, well actually, this is going to be this.props.theme.

>> Brian Holt: I think that's the only reference to it. Okay, cool. And now we just have to go connect it. So here we're gonna say const WrappedDetails is going to be equal to connect(mapStateToProps) and then Details. And then we're going to change this to be WrappedDetails, and then we just have to quickly right const mapStateToProps.

[00:01:41] That's gonna be this. It's going to take on a theme and it's going to return an object that has theme in it.
>> Brian Holt: Right, because our redux store has both theme in it as well as location, but this particular component doesn't care about location. So we don't want to inject that, we just want to inject theme.

[00:02:05] That's why we're only pulling out theme and injecting that. And so now, if you go back over to details, submit, go look at Fat Boy Slim here. Still reading and writing from redux, right? So everything I've shown you so far as purely synchronous, a redux, right? We didn't do any Ajax requests.

[00:02:29] We didn't do anything like that. In V3 of the course, as well as perhaps before, I don't remember if we did it before or not, we go over redux thunk, which is one way to do request something from an API, get it back, feed it into redux. Yeah, there's just more complex things that you can accomplish with redux.

[00:02:49] But for now, I think this is enough of a demonstration to show you what you're getting into if you if you're getting into redux. We're gonna do git reset --HARD, or hard like that to HEAD. And then we're gonna say git clean -f. I have a really hard time distinguishing mpm and git cuz they're three letter things and I use both of them constantly.

[00:03:29] I think I have to do rf. No?
>> Brian Holt: All right, whatever. I think I still have, yeah, some of these folders exist, but let's just go delete them manually. Server.
>> Brian Holt: Delete.
>> Brian Holt: And source.
>> Brian Holt: To trash, reducers, move to trash.