처음 만난 리덕스 (Redux) 문서
9.1 FSA (Flux Standard Action)
먼저 Flux Standard Action의 개념에 대해 알아보겠습니다.
https://github.com/redux-utilities/flux-standard-action
위 화면은 Flux Standard Action의 GitHub repository입니다.
Star가 4,700개 정도로 굉장히 많은 것을 알 수 있고 프로젝트를 소개하는 About 부분에는 이렇게 적혀 있습니다.
“A human-friendly standard for Flux action objects”
해석해보면 사람에게 친화적인 Flux Action 객체 표준이라는 뜻이죠.
즉, 이 Flux Standard Action은 Flux 아키텍처의 Action 객체를 위한 하나의 표준이라고 보면 됩니다.
그렇다면 Flux Standard Action이 적용된 Action 객체는 어떤 모습일까요?
{
type: 'ADD_TODO',
payload: {
text: 'Do something.'
}
}
이 코드는 가장 단순한 형태의 Flux Standard Action 객체를 나타낸 것입니다.
우선 Action 객체이기 때문에 Action의 이름을 나타내는 type 필드가 필수적으로 들어갑니다.
그리고 payload라는 필드를 통해 Reducer에 함께 실어서 보낼 데이터를 객체 형태로 넣어주고 있습니다.
우리가 앞에서 작성했던 Action 객체와 비슷하지만, 여기에 표준화된 규칙을 적용해서 체계적으로 관리하기 위한 목적으로 만든 것이 바로 Flux Standard Action입니다.
그렇다면 Flux Standard Action에는 어떤 규칙들이 있는지 살펴보도록 하겠습니다.
- An action MUST
- be a plain JavaScript object.
- have a type property.
- An action MAY
- have an error property.
- have a payload property.
- have a meta property.
- An action MUST NOT include properties other than type, payload, error, and meta.
먼저 action은 일반적인 JavaScript 객체 형태여야 합니다.
그리고 당연히 type 속성을 갖고 있어야겠죠.
그리고 action은 error, payload, meta라는 속성을 가질 수도 있습니다.error는 Action이 에러인지 여부를 나타내는 boolean 속성이고, payload는 Action에 함께 실어 보낼 데이터를 의미하는 속성이며, meta는 payload와는 별개로 Action에 대한 메타 데이터를 나타내기 위한 속성입니다.
이 세 가지 속성은 optional이기 때문에 필수는 아닙니다.
그리고 마지막으로 action은 위에서 나왔던 type, payload, error, meta를 제외한 다른 속성은 포함할 수 없습니다.
이게 바로 Flux Standard Action의 규칙입니다.
생각보다 복잡하지 않고 직관적이며 단순하죠?
이 규칙을 지켜서 Action 객체들을 만들고 관리한다면, 규모가 큰 프로젝트에서도 체계적으로 Redux를 사용할 수 있습니다.
하지만 개발자가 직접 이러한 규칙들을 지키는 것은 조금 번거로울 수 있습니다.
그래서 등장한 라이브러리가 바로 redux-actions입니다.
마지막 업데이트: 2023년 07월 14일 00시 00분
이 문서의 저작권은 이인제(소플)에 있습니다. 무단 전재와 무단 복제를 금합니다.