[TIL] 2022/02/03

TIL

• Redux 를 왜쓸까 ? : 사실 redux는 내가 작년에 스타트업에서 일하면서 너무나도 애용(?)했던 라이브러리였기 때문에 이제와서 이걸 왜쓸까라고 묻는 것은 앞뒤가 안맞긴 한 것 같지만, 정리해보면 다음과 같다. 먼저, 내 주관적인 생각으로는 component 내에 state를 관리하게 되면 redux setting을 안해줘도 된다는 점에서는 편리할지 모르나, 결국 state가 많은 대규모 프로젝트라면 컴포넌트와 state 관리 부분을 구분해서 하면 가독성이나 코드 관리 및 유지 보수 측면에서 용이하다는 점을 부인할 수 없는 것 같다. 이에 더하여 객관적인 리덕스의 장점으로도 앞서 내가 말한 state와 컴포넌트의 분리 그리고 state 끌어올리기 등의 스킬이 필요없어지고, 불필요한 리렌더링이 일어나는 것을 막아준다는 장점이 있다. 물론 Context API를 통해 전역 state 관리를 할 수 있지만, 대규모 프로젝트에서 state만을 따로 분리하여 관리하기에 redux만큼 용이한 라이브러리는 아직 없다고 생각한다.
• redux에서 핵심 개념들
  1) 액션 : 상태에 변화를 일으킬 때 쓰는 혹은 발동시키는 무언가라고 생각하면 되고, 반드시 type을 써줘야한다. 상태를 변경할 때는?! Action!!
  2) 액션 생성 함수 : 앞서 말했듯이 상태를 변경하고자 할 때는 액션을 일으키는데, 이 때, 액션을 생성하는 함수를 액션 생성 함수라고 한다. 근데 사실 액션은 js object 이기에 단지 만들어서 쓰면 된다고 생각할 수 있지만, payload가 있는 액션은 함수로 만들어서 쓰는 것이 훨씬 편리하고, 매번 번거롭게 액션을 계속해서 생성할 필요가 없으며 규격화된 액션을 생성하도록 할 수 있다.
  3) 디스패치(dispatch) : state를 변경하고자 하면 액션을 일으켜야 한다고 했는데, 디스패치를 통해 액션을 실제로 적용할 수 있다. 하지만, 정말 디테일하게 파고들어가서 정확히 무엇이 후에 말할 Store의 state를 변경시키냐?!하면 그건 사실 dispatch가 아니라 store내의 reducer이다. 그래서 dispatch는 reducer를 발동시키는 일종의 reducer launcher라고 생각하면 될 것 같다(dispatch를 쓰면 store내의 reducer 함수가 실행된다).
  4) reducer(리듀서) : 앞서 말했듯이 store 내에 속하는 것으로 state, action을 받아서 실제로 state를 변경한다. 이 때, dispatch를 통해 reducer로 액션이 전달되는 형태로 이뤄진다.
  5) store(스토어) : 실제로 state, reducer가 들어있는 곳으로 프로젝트에 리덕스를 적용하기 위해 스토어를 만든다. 이 때, 하나의 프로젝트 내에는 반드시 하나의 스토어만 생성한다. 이에 더하여, 다양한 리덕스 관련 내장 함수가 들어있다.
• 맥 한영 전환 딜레이 해결 : 이거 맨날 그냥 참아야지, 참아야지 하고 썼는데 도저히 안되겠어서 해결했다. 사실 너무 간단하게 해결돼서 여태까지 참아온게 현타올 정도,, -> 참고 블로그

Comment

: 주말에 리덕스 배운 개념 가지고 '점진적 과부하' 앱에 리덕스 적용해보자. 이 때, action, action 생성함수, reducer 등 전부다 분리해서 디렉터리 구조 만들어보는식으로 해보자. + useSelector, useDispatch 등 hooks 사용해서 간편화 해보는 방향으로 만들기