A Guide to Redux + Angular

A Guide to Redux + Angular

My talk at Angular Connect


Pavithra Kodmad

September 27, 2016


  1. A Guide to Angular + Redux Pavithra Kodmad @pkodmad

  2. Problems to solve Unclear Data Flow with double binding (ngModel/ngRepeat)

  3. Problems to solve Non-isolated child scope scope: {}

  4. Problems to solve Component communications $emit/$broadcast/watch

  5. Problems to solve Hard to discover functionality and test

  6. Problems to solve ES6 (Modules and spread op)

  7. Redux Primer

  8. Redux Single immutable application state

  9. Redux State is held by Redux Store

  10. Redux http://gaearon.github.io/the-redux-journey/

  11. Redux Reducer (state, action) => state

  12. Redux

  13. Redux Actions are dispatched by Composable View (Here Angular)

  14. Redux

  15. Redux View subscribes to state changes Refreshes itself

  16. Redux https://twitter.com/thekitze/status/727821044308967425

  17. ng-redux - Angular bindings to redux $ngRedux.createStoreWith(rootReducer) $ngRedux.connect()($scope) https://github.com/angular-redux/ng-redux

  18. ng-redux

  19. ng-redux

  20. ng-redux

  21. ng-redux

  22. Problems solved Unclear Data Flow with double binding Non-isolated child

    scope Component communication Hard to test
  23. None
  24. What about ES6?

  25. ES6 + Angular

  26. Resources Angular redux Todomvc https://github.com/kalcifer/todomvc/tree/angular-redux Ng-redux https://github.com/angular-redux/ng-redux About using ng-redux

    http://blog.rangle.io/managing-state-redux-angular/ Redux https://egghead.io/redux Babelify https://github.com/babel/babelify
  27. A Guide to Angular + Redux Pavithra Kodmad @pkodmad