1. 21
    Redux: Extracting Presentational Components (AddTodo, Footer, FilterLink)
    8m 35s

Redux: Extracting Presentational Components (AddTodo, Footer, FilterLink)

InstructorDan Abramov

Share this video with your friends

Send Tweet

Learn how to separate the looks from the behavior by extracting presentational components.

Arthur
Arthur
~ 5 years ago

Hi,

Thanks for the tutorial it's been really great. One question I had on this lesson is, why was the onClick action removed from FilterLink and moved up as a prop on the Footer? While I understand the desire to split container components from presentation components, it seems like this is a step back as I now have to remember to attach the onClick prop to each FilterLink in Footer instead of having it in one place in the FilterLink component itself. While I could see this being useful if you wanted each instance of FilterLink to fire a different action, it seems unnecessary when all three are firing the same action. Is there another way to handle this that would get the best of both worlds?

Also, a comment on the use of JS Bin for the entire lesson. Right around this chapter it became pretty difficult to keep track of all the elements in one file in a browser based IDE/text editor. It might be helpful to break out the ToDo example into multiple files as this would show a recommended folder/application structure.

Thanks for the tutorial and I hope more are in the future!

Arthur
Arthur
~ 5 years ago

My first question was answered in the very next chapter. :)

compile
compile
~ 5 years ago

function const TodoApp replaced container component class TodoApp. After doing the above its no longer possible to log live store updates to console. It was possible to log live store updates to console inside of component class TodoApp. Now logging is done outside of function const TodoApp but its not live?

Arijit Bhattacharya
Arijit Bhattacharya
~ 5 years ago

If you functional components is sounding new to you, this post will help undertsand this update released in React 0.14

David Dean
David Dean
~ a year ago

This course is so well organized. Each logical step is broken down so that the code lines up perfectly with the concept behind it. I think it might be easy for people new to React or to programming to follow the code part without catching the concept part but these are industry best practices just casually being executed in each video. I appreciate this course more with each lesson.