Building a React.js App - ES6 Refactor: Routing without Mixins

Share this video with your friends

Send Tweet

In this video, we’ll walk through refactoring the routing of our application to get away from mixins and be compatible with JavaScript Classes through context.

Logan
Logan
~ 9 years ago

So thankful you covered this. During the react router section I kept worrying I was going to have to give up my nice ES6 so I could use the router mixin.

Tyler McGinnis
Tyler McGinnis(instructor)
~ 9 years ago

Thanks Logan! You'll be happy to hear that React Router 1.0 (coming soon) gets rid of Mixins and you don't even have to use contexts. It's really slick.

Alex
Alex
~ 9 years ago

I am curios about debugger use. I like the idea of looking through the state but is there a way to do tracing instead (besides the obvious logging)?

So, I do not have to stop the world to examine things. It would be very useful for async/timed events. I know it is probably the wrong place to ask but maybe you can give me some references if not the answer.

Tyler McGinnis
Tyler McGinnis(instructor)
~ 9 years ago

Hi Alex. Great question. I'm actually not sure since I always just use debugger. If you find an answer, definitely let me know.

egghead eggo
egghead eggo
~ 9 years ago

The lesson video has been updated!

Brandon
Brandon
~ 8 years ago

Hey Tyler, for some reason I'm doing the above and this.history, when passed from my parent component to the child component that needs them its undefined...even though the parent component is defined in routes.js.

When I console.log "this" in my parent component I see the props are defined after I open up the object in the console...and history is there. But right after I print JSON.stringify(this.props.history) and its an empty object. Any reason for this?

Brandon
Brandon
~ 8 years ago

Even adding console.log(this.props.history) in main before my render method console.logs to Object{} but when I actually open the object in the console, I see history there.