Redux action creator의 존재 이유에 대한 사색

이동현·2022년 5월 16일
7

React

목록 보기
13/16

Redux의 action creator

redux 를 프로젝트에 사용하는데 action 이라는 객체를 활용한다.

여기서 action 객체는 필수적으로 type 이라는 키 값을 갖는다.

value로 문자열을 갖고 그 문자열에 해당하는 함수를 실행하여 store에 있는 state의 값을 업데이트해주는 방식이다.

그런데 예제 코드 등을 보다보면 action 객체를 dispatch() 함수 인자로 넣어주는데 action creator라는 함수를 이용해서 넣어주는 방식을 많이 사용한다.

const actionCreator = () => (
  {
	type: SOME_TYPE,
    data: {..some data}
  }
)

dispatch(actionCreator());

위와 같은 방식으로 사용되는데 여기서 actionCreator 가 해주는 역할은 단순히 객체를 반환해주는 역할밖에 하지 않는다.

그냥 인자로 객체를 넣어주면 되는데 왜 이런 식으로 사용하는지에 대해서 궁금해지기 시작했다.

redux를 입문하는 단계이고 어떤 특별한 장치가 있거나 더 활용될 수 있는 확장성을 갖고 있진 않을까 고민을 많이 해봤지만 어디에서도 찾아볼 수가 없었다.

그러다가 redux thunk를 이해하기 위해 아티클을 보다가 action creator를 사용하는 원인에 대해서 공감가는 근거를 하나 찾았다.

Thunks In Redux: The Basic의 글쓴이의 의견에 따르면 dispatch함수에 넣어줄때마다 일일이 객체를 선언해서 넣어주면 인간적인 실수를 할 수도 있기 때문에 일관된 포맷을 유지한 객체를 반환해주는 action creator를 사용해서 인간적인 실수를 줄이기 위해사용한다는 것이다.

생각보다 너무 간단한 이유였지만 충분히 일리있는 근거였고 궁금증이 해소되었다.

여기에 더해서 한 가지 이점이 더 있다. Cartoon Guide To Flux의 글쓴이에 따르면 아래와 같이 말하고 있다.

모든 가능한 액션들을 아는 시스템(action creator)을 가짐으로써 부차적으로 갖는 멋진 효과가 있다. 새로운 개발자가 프로젝트에 들어와서 행동 생성자 파일을 열면 시스템에서 제공하는 API 전체 — 모든 가능한 상태변경 — 를 바로 확인할 수가 있다는 점이다.

action creator 들을 갖고 있는 파일을 보면 어떤 행동들을 할 수 있는지를 다른 개발자가 쉽게 이해할 수 있다는 것이다. 한 파일에 일목요연하게 갖고 있다면 어떤 action들을 사용해야 할 지 찾아보기 쉬울 것이다.

출처

Thunks In Redux: The Basic
Cartoon Guide To Flux

profile
Dom Hardy : 멋쟁이 개발자 되기 인생 프로젝트 진행중

2개의 댓글

comment-user-thumbnail
2022년 5월 25일

오 저도 이거 궁금했었는데 이런 이유가 😮❗️ 잘 보고 갑니다 하디햄~

1개의 답글