Real World Redux

Real World Redux

Redux has no doubt captured the hearts of the React community but many questions still remain - how do we actually structure Redux applications effectively? This talk explores the real world experiences of using Redux everyday within a rapidly scaling team and product.

Presented at "React London" - 29th February 2016

Event: https://skillsmatter.com/meetups/7887-february-london-react-user-group
Recording: https://www.youtube.com/watch?v=zmN0Vhx2Jgg

http://chrispearce.co/

2c4d5ca71a92e0860a78e4f9e50e4406?s=128

Chris Pearce

February 29, 2016
Tweet

Transcript

  1. 6.

    Actions Reducer Store View function reduceAppState(state, action) { if (action.type

    === ‘AUTH_USER’) { return {...state, loggedIn: true}; } } Translate
  2. 8.

    Actions Reducer Store View const App = ({state}) => (

    <div> {state.loggedIn ? ‘Yay!’ : ‘Boo!`} </div> ); Render
  3. 16.
  4. 22.

    Service orientated architecture 1-1 mapping with api/resources API/users -> users-actions.js

    users-reducer.js users-selectors.js API/clients -> clients-actions.js clients-reducer.js clients-selectors.js
  5. 23.

    Service orientated architecture User Experience Orientated Architecture 1-1 mapping with

    routes (at its min. granularity) index -> index-screen-actions.js index-screen-reducer.js index-screen-selectors.js
  6. 28.

    Yes! Just don’t underestimate the big decisions you are still

    left to make yourself. It is incredibly low level.
  7. 29.
  8. 30.
  9. 31.

    Redux is awesome but we need to realise the scope

    and build more opinionated tools and frameworks around it.