flux패턴은 단방향으로 데이터 흐름을 관리하는 디자인패턴입니다.
ex)
페이스북은 “읽은 표시(mark seen)”에 대한 기능장애를 겪었습니다. 어떤 페이지에서 메시지를 읽었는데 다른 페이지에서는 메시지가 안 읽었다고 뜨는 것이죠. 이는 모델(model)과 뷰(view)의 관계가 복잡해지니 버그를 수정하기도 데이터흐름을 알아보기 어려운 문제였습니다.
즉, 뷰에서 일어난 것이 모델에 영향을 끼치기도 그 반대도 영향을 미치는 로직도 있는 상황이 발생하여 데이터를 일관성 있게 뷰에 공유하기가 어려웠습니다. 이를 위한 해결방법으로 데이터가 “한방향”으로만 흐르게 flux 패턴이 등장했습니다. flux패턴은 action, dispatcher, store, view 라는 계층으로 구성됩니다
사용자의 이벤트를 담당합니다. 마우스 클릭이나, 글을 쓴다던가 등을 의미하며 해당
이벤트에 관한 객체를 만들어내 dispatcher에게 전달합니다.
Dispatcher는 들어오는 Action 객체 정보를 기반 어떠한 “행위”를 할 것인가를 결정합니다.
보통 action객체의 type를 기반으로 미리 만들어 놓은 로직을 수행하고 이를 Store에
전달합니다.
스토어는 애플리케이션 상태를 관리하고 저장하는 계층입니다. 도메인의 상태, 사용자의
인터페이스 등의 상태를 모두 저장합니다.
데이터를 기반으로 표출이 되는 사용자인터페이스입니다.