나에겐 너무 무서운 Redux

잔잔바리한접시·2022년 6월 3일
1

react

목록 보기
3/12

redux는 무엇인가

규모가 어느정도 있는 프로젝트를 하다보니 props를 통해 data 혹은 state를 자식 컴포넌트에게 넘겨주는 것이 귀찮아질때... 그때가 바로 redux를 공부할 때다.

props를 통해 자식에게 데이터를 전달하는 것도 한계가 있다. 만약 자식의 자식의 자식의... 끝도 없는 구조에서는 props가 추가될 때마다 매번 수십, 수백개의 컴포넌트 파일을 열어 props를 추가해야 한다.(상상만해도 끔찍함)

redux를 공부할 적기는 바로 이때야!

store

store는 우리가 컴포넌트에서 사용하는 데이터나 상태 값을 저장할 수 있는 저장소다. 하지만 이 저장소는 매우 엄격하게 관리되기 때문에 값을 직접 변경하거나 열람하는 것이 불가능하다(마치 은행을 찾아가는 우리처럼).

reducer

reducer는 데이터의 수정방법을 정의하는 함수다. 또한 store의 state를 변경할 수 있는 유일한 방법이다. 그렇다면 어떤 reducer를 실행할지 정하는 역할을 하는 것이 action이다.

action

action은 state의 변경을 일으키는 이벤트에 대한 정적인 정보다. action의 타입을 통해 어떤 reducer를 실행할 것인지 특정할 수 있고 두번째 인자로 reducer 실행에 필요한 값을 넣어줄 수 있다.

dispatch

dispatch는 store의 내장 함수 중 하나로 reducer에게 action을 발생시키라고 시키는 trigger의 역할을 한다. dispatch는 action을 인자로 넘기며 이렇게 호출이 되면 스토어가 리듀서 함수를 실행해서 함수가 넘긴 action을 확인하고 새로운 상태를 만들어준다.

회고

redux의 존재를 알았을 때는 21년 10월 쯤이였따.. 사실 코딩 뿐 아니라 어떤 공부를 하든 우선 헤딩부터 하는 공부 방식을 선호하는 나는 redux에 헤딩을 했다가 머리가 부숴지고 말았다...
일단 사용하고 보자는 내 오만함을 사그러들게한 놈이다. 앞으로는 이해하고 쓰는 습관을 들이자!

0개의 댓글