Last active
January 27, 2016 09:54
-
-
Save astannard/6273f4aa7aab9eed97ed to your computer and use it in GitHub Desktop.
Redux Notes
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
1/ 1 object to represent the whole set of app data | |
2/ State is read only | |
3/ Pure functions dont modify arguments and dont rely on anytihng other than arguments passed to them to calculate | |
4/ UI is a representation of application state, | |
5/ State changes use pure functions so you take the existing state and the action to calculate a new state from, then pass that back. (testable and predictable). The new state can still reference old objects that made up the previous state if these have not been modified | |
6/ Reducer function takes the state and action arguments to create new state. (an action is the minimum set of arguments needed to create a new state object from its previous state | |
7/ If reducer recieved undefined as its stateargument it must return what is to be considered the inital state of the application | |
8/ If a reducer recieves an unknow action it mus return the existing state | |
9/ return [...state, {id:action.id, text:action.text}] //this creates a new array using the old arry with the new records appended in | |
10/ return state.map(todo => { | |
if (todo.id !== action.id){ | |
return todo; | |
} | |
return { ...todo, | |
completed: !todo.completed //spread opperation uses old object as base but completed is overriden and reversed here | |
}; | |
}); | |
User Reducer composition pattern to seperate concerns | |
combineReducers - a reduc function for automatically combining them | |
name reducers after the state keys they manage | |
expect liabary |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment