Upgrade to Pro — share decks privately, control downloads, hide ads and more …



Internal Lightning Talk @ Redgate, Cambridge, UK


Tugberk Ugurlu

August 23, 2016

More Decks by Tugberk Ugurlu

Other Decks in Programming


  1. Redux Tugberk Ugurlu

  2. The Problem

  3. What is Redux? “Redux is a state management library for

    JavaScript applications, inspired by Flux and Elm.
  4. The Meat of Redux Actions Reducers Store

  5. The Meat of Redux Actions Actions describe updates

  6. The Meat of Redux Reducers Reducers apply updates based on

  7. The Meat of Redux Store Store is where everything comes

    together and it acts as the source of truth
  8. Simple Example: Counter

  9. React Usage (Manual Way)

  10. Usage with React (Much Better)

  11. The Whole Idea You have one state, one state only

    for your entire application! https://flic.kr/p/9QQHW
  12. The Whole Idea You never mutate the state! https://flic.kr/p/pzf72v

  13. But why Redux and not flux, mobx, marty? https://flic.kr/p/NzcYg

  14. Widely Adopted

  15. Widely Adopted

  16. Rich Docs and Resources http://redux.js.org/

  17. Rich Ecosystem https://www.npmjs.com/search?q=redux

  18. Rich Ecosystem http://redux-form.com/6.0.0-rc.5

  19. 99% Boost on Dev Happiness https://flic.kr/p/99iZtS

  20. 99% Boost on Dev Happiness npm install redux-logger https://github.com/evgenyrodionov/redux-logger

  21. 99% Boost on Dev Happiness npm install redux-immutable-state-invariant https://github.com/leoasis/redux-immutable-state-invariant

  22. 99% Boost on Dev Happiness npm install redux-undo https://github.com/omnidan/redux-undo

  23. None
  24. https://egghead.io/courses/getting-started-with-redux Some Resources

  25. https://egghead.io/courses/building-react-applications-with-idiomatic-redux Some Resources

  26. Some Resources • Redux Docs: http://redux.js.org • The Redux Journey

    at react-europe 2016: http://bit.ly/2bJEZEP • Flux Architecture: https://facebook.github.io/flux/docs/overview.html • Redux Usage with React: http://bit.ly/2bdAiVO • Presentational and Container Components: http://bit.ly/2bM3DpO • (Pluralsight Course) Building Applications with React and Redux in ES6: http://bit.ly/2bRAQ4T • Thinking in React: https://facebook.github.io/react/docs/thinking-in-react.html • React Reconciliation: https://facebook.github.io/react/docs/reconciliation.html • Influencers of Redux: https://github.com/reactjs/redux#influences • Why did you reinvented Event Sourcing?: https://github.com/gaearon/ama/issues/110