🚩 Redux 기초 정리하기
이제야 React Redux가 무슨 역할을 하는건지 제대로 알았다.
그리고 이제야 공식문서의 첫 페이지를 이해할 수 있게 되었고,
이제야 공식문서를 통해서 어떻게 공부하면 되는지도 감이 잡혔다.
역시 기초부터 다지는 게 답이다.
React Redux를 하기 전에 Pure Redux부터 정리하고 넘어가자.
Redux is a predictable state container for JavaScript apps.
Redux is most useful when in cases when:
(*출처: When should I use Redux?)
핵심 원리는 공식문서 Core Concepts | Redux에서 아주 친철하게 설명해주고 있다.
처음에는 정말 느릿느릿하게 설명해주는 생활코딩의 강의를 두번씩 돌려보고
정말 쉽게 설명해주는 노마드코더 강의도 두번을 봤어도 뭔 뜬구름 잡는 소린가 했는데,
이제는 직접 써보고 필요성을 느낀 뒤여서 그런지 더 잘 이해가 되고 있다.
(아래 코드 예제는 모두 공식문서에서 가져왔다.)
{ type: 'ADD_TODO', text: 'Go to swimming pool' }
{ type: 'TOGGLE_TODO', index: 1 }
{ type: 'SET_VISIBILITY_FILTER', filter: 'SHOW_ALL' }
function todos(state = [], action) {
switch (action.type) {
case 'ADD_TODO':
return state.concat([{ text: action.text, completed: false }])
case 'TOGGLE_TODO':
return state.map((todo, index) =>
action.index === index
? { text: todo.text, completed: !todo.completed }
: todo
)
default:
return state
}
}
function todoApp(state = {}, action) {
return {
todos: todos(state.todos, action),
visibilityFilter: visibilityFilter(state.visibilityFilter, action)
}
}
노마드코더 [초보자를 위한 리덕스 101]
리덕스 공식문서 https://redux.js.org/