const nextState = produce(currentState,draft => {function})
-nextState -> 다음 상태 변수 이름
-currentState -> 업데이트하고자 하는 현재 상태값
-draft -> 현재 상태값을 복사하여 사용
-function -> 어떻게 업데이트하고 싶을지 정의하는 함수
const state = {
number: 1,
text: 'immutable',
};
const nextState = produce(state, (draft) => {
draft.number += 1;
});
/*
console.log(nextState);
{
number:2,
text:'immutable'
}
*/
기존의 리덕스 액션 타입을 정의하는데 있어서 redux-actions을 사용하지 않고 그냥 액션 타입을 정의하고 액션 생성함수를 생성했었다. 그리고 reducer 함수를 만들때도 immer를 사용해본 적이 없었는데 오늘 처음 사용해봤다. redux-actions는 뭔가 쓰면서 굳이 사용해야하나 싶었다. 아직 프로젝트가 크지 않은 환경에서 혼자 이것저것 끄적이다보니 액션 타입의 개수가 많지도 않고 크게 필요성을 못 느끼는것 같아서 그런것 같다. 하지만 immer는 확실히 쓰면서도 아 이거구나 싶은 느낌였다. 물론 immer를 쓰지않고도 reducer함수를 만들 수 있다는 가정하에.. JS의 얕은 복사와 깊은 복사의 개념과 연관지어서 한 번쯤 생각해 볼 만한 주제라고 생각한다.
어쨌든 immer는 나중에 실전 프로젝트에서도 기회가 된다면 사용해보고 싶다. 하지만 redux-actions? 뭔가 안익숙해서 그런지 살짝 애매하다.. 하지만 자주 쓰다보면 익숙해지지 않을까 싶기도 하고 확실히 redux-actions를 사용한 코드가 더 깔끔해 보이는것 같기는 하다.
오늘은 여기까지만 하구 내일은 js 비동기통신에 대해서 공부해볼 생각이다. 물론 공부한 내용이지만 인간은 망각의 동물이라... 쨌든 비동기 통신쪽 다시 정리하고 redux 미들웨어 통신쪽도 공부해 볼 생각이다. 리덕스 툴킷이 나온 이후로 사가랑 텅크는 거의 안쓴다고는 하던데 공부하는 입장이니 이것저것 거를거 없이 한번 공부해보자.