Redux, MVC, NGRX, ... What is it ??
Components is cool !
But what is component ?
Custom HTML Element
View
Properties
Internal State
<LikeBtn nbLike="36" />
// isLiked = false
<LikeBtn nbLike="37" />
// isLiked = True
Component in React
C
C
C
C
C
C
C
C
C
State
State
State
State
State
State
State
State
State
State management is hard
MVC
To the rescue
The original one
Applied to Angular
Redux
First principle of redux
Single source of truth
The state of your whole application is stored in an object tree within a single store.
Single source of truth
C
C
C
C
C
C
C
C
C
State
State
State
State
State
State
State
State
State
Single source of truth
C
C
C
C
C
C
C
C
C
State
Store
Second principle of redux
State is read-only
You have to dispatch action to change the state
State is read only
State
Store
Components
Action
Third principle of redux
Changes are made with pure function
Reducer must not modify their arguments
Changes are made with pure function
State
Store
Components
Action
Reducer
new State
Focus on a particular component
State
Store
Container (HOC)
Action
Reducer
new State
View
(stateless Component)
Props
React with redux
React with redux
React with redux
React with redux
What is Redux ? (and all redux-like)
By Florent Berthelot
What is Redux ? (and all redux-like)
What is the goal of redux in a component environnement ? I will compare Redux with MVC pattern before going deeper and compare Redux with common implementation in Current Frameworks.
