React JS / Redux Tutorial – 7 – mapStateToProps

[ad_1]
Facebook –
GitHub –
Google+ –
LinkedIn –
reddit –
Support –
thenewboston –
Twitter –


Posted

in

by

Tags:

Comments

27 responses to “React JS / Redux Tutorial – 7 – mapStateToProps”

  1. Leila Onsori Avatar

    I love your teaching. You are such a awesome teacher

  2. Brian Hawi Avatar

    HAHA Lazy Bucky…you could have separated containers and components

  3. Maegan Womble Avatar

    Thank you!!! I really appreciate this!

  4. nada naeem Avatar

    Thanks Bucky Bacon 🙂

  5. fasilvip Avatar

    the best tutorial for react-redux

    I advise you follow the lessons from the beginning

  6. sunshineo23 Avatar

    WTF, show us how to use the 'user' in the component? I cannot get it to work at all.

  7. Manindra Gautam Avatar

    Components exported to the containers

  8. emberchord Avatar

    hm, why do you not need to this.createListItems = this.createListItems.bind(this); ? Is this something you don't need to do when you don't have stateful components?

  9. Mehdi Farsi Avatar

    I give you "props" from France ! #GeekJoke #ReadOnlyJoke

  10. elCamo12 Avatar

    That first sentence xD
    An I'm even a freakin Kraut! Thanks for the callout xD

  11. Pierre Rohan Avatar

    Hi Bucky and many thanks for the awesome tutorials, fun and very helpful

    one question here :
    I don't get how what seems to me to be the container (App) of the different components is actually in the "component" folder while what seems to me to be the components (like the user lists "class UserList extends Component" ) are in the "container" folder. I understand the logic of the diagram but not the way its applied here !

  12. Aaron Rood Avatar

    I love you Bucky Lasek, you are a good skateboarder too.

  13. Bingjing Xu Avatar

    Really like your humorous way of explaining technology, which makes this piece of cold knowledge way more warm and interesting!

  14. NonGamer live 247 Avatar

    Thank you – this is so kick ass

  15. Youtubist007 Avatar

    connect(mapStateToProps)(UserList) is a curried function. It takes UserList component and decorates it with props and for the values of props, it uses mapping from the mapStateToProps function.

    Notice we export this newly decorated component not the component itself.

    When called in connect function, mapStateToProps gets the state from Provider component. Remember we supplied store={store} prop in Provider component. store.getState() is the very same state mapStateToProps function uses.

  16. abhimanyu katyayan Avatar

    Where can I get that diagram.png at @0.44 sec ?

  17. Zbyněk Ondrák Avatar

    I had to get back to the explanation of the difference between the containers and components directories which confused me later in the tutorial. I'd suggest call the dumb component directory something different from the diagram like 'plainhtml'.

  18. Yannis De Cleene Avatar

    How can such a verbose function as mapStateToProps be difficult? Guess you're just an amazing teacher for making that not even a possibility.

  19. Thomas La Greca Avatar

    This series kills it. many thanks.

  20. harken Avatar

    By the end of the tutorial the page doesnt render when I use

    export default connect(mapStateToProps)(UserList);

    but when i just do regular export default UserList; itll render.

    PLEASE HELP.. heres my UserList function:
    http://pastebin.com/EGmebXme

  21. Francisco Gutiérrez Avatar

    I am not state.users is undefined… I don't know where the bug is

  22. vikash kaushik Avatar

    Awesome and easy explanation to react-redux 🙂

  23. Alvan Zaputra Avatar

    anyone can help ?

    Module build failed: SyntaxError: Unexpected token (16:7)

    14 | }
    15 |
    > 16 | export default UserList;
    | ^
    17 |

    BabelLoaderError: SyntaxError: Unexpected token (16:7)

    14 | }
    15 |
    > 16 | export default UserList;
    | ^
    17 |
    —-
    its on default actually ( the up arrow is under the "d" )

Leave a Reply

Your email address will not be published. Required fields are marked *