Redux에서 쓰이는 Flux 패턴이란?

 

페이스북에서 고안해낸 패턴으로

 

MVC 패턴은 눈 깜빡할 사이에 구조가 엄청 복잡해진다 하여

(규모가 좀 커지면 컨트롤러와 비즈니스 로직이 문어발처럼 여기저기 연결되기 쉽습니다.)

단방향 데이터 흐름이 핵심인 flux 패턴을 고안해냈습니다.

 

 

 

Action -> dispatcher -> store -> reducer

 

이렇게 단방향으로 reducer까지 액션객체가 전달되어 redux의 상태값이 변경이 됩니다.

 

코드의 흐름으로 봤을땐

 

dispatch 에 액션생성함수로 만들어낸 액션객체를 전달하면

 

dispatch가 store에 액션객체를 전달하고 

 

store가 알맞은 리듀서에 액션객체를 전달하여 상태값을 변경할수 있게 합니다.

 

하지만 코드를 짤때 매번 액션객체를 생성해주는 함수를 만들고

 

리듀서에서는 스토어에서 전달받은 액션객체를 매번 각각 케이스를 나뉘어서

 

올바른 리듀서에 매핑되게끔 코드를 짜는건 번거로운 일 입니다.

 

이 번거로움을 줄여줄수 있는 redux-toolkit 이라는 패키지가 있는데 다음 글에서 한번 redux-toolkit에 대해 작성해보겠습니다.