Redux 미리보기

• Redux 란?
⇒ action을 사용하여 애플리케이션 상태를 관리하고 업데이트하기 위한 패턴 및 라이브러리

• 사용 예시 및 설명

//리듀서 : state 복사본을 각 액션에 따라 조작해서 새로운 state 반환
//cf) setState: 현재 state를 변경, getState: 현재 state를 반환
const reducer = (state=[], action) => {
	switch(action.type) {
		case "ADD_TODO": //상태를 어떻게 조작할까를 정의
			return [...state, action.text] //새 상태를 반환 => store의 상태가 이걸로 바뀜
		default:
			return state
	}
}

const store = createStore(reducer, initialState)
//이제 스토어는 set/getState를 가짐

store.dispatch({
	type: "ADD_TODO",
	text: "과제 하기"
}) // 상태를 setState하는 것

/*
const increment = () => { //일반적으로 액션 생성자 사용
  return {
    type: 'counter/increment'
  }
}

store.dispatch(increment()) 
*/

store.getState()
// 현재 상태

const handleChange() {
}

store.subscribe(handleChange)
//액션이 dispatch될 때마다 해당 리스너가 실행됨