강디너의 개발 일지

디자인 패턴 : Flux 본문

Javascript/삽질

디자인 패턴 : Flux

강디너 2018. 11. 26. 15:36
728x90

Flux 에 관하여



Flux 는 MVC 패턴을 보완할 목적으로 Facebook 에서 만든 아키텍쳐다.


React 에서의 Redux, Vue 에서의 Vuex 가 여기서 나온듯 한...?


차이점도 검색해봤는데 아직 이해를 못해서 나중에...



Flux 의 중점 : 단방향 데이터 흐름




Flux 패턴의 핵심 요소


1. Store 

 - 애플리케이션의 상태를 저장

 - MVC 패턴의 Model 과 비슷하지만

Model 과 View 사이의 데이터 흐름이 양방향으로 흐르게 되서 대규모가 되면 복잡도가 커지며 이해하기가 어려워진다.


Store 와 View 사이의 데이터 흐름은 단방향으로 흐르기 때문에 각각의 Store 와 View 는 서로 직접적인 영향을 주지 않기 때문에 여러 개의 Store 나 View 를 가지고 있어도 하나의 Store 나 View 를 갖는거랑 똑같다.

 - store 는 다른 store 를 직접 변경할 수 없다.


2. Dispatcher

 - Flux 아키텍처의 모든 데이터 흐름을 관리

 - Action 이 발생했을 때 Dispatcher 는 store 를 어떻게 갱신할지 결정


3. View

 - store 가 변경되면 View 도 갱신

 - Controller 역할도 함



* Action 은 데이터라고 생각하시면 편합니다.


피드백은 언제나 감사합니다.


반응형

'Javascript > 삽질' 카테고리의 다른 글

Vscode Extension (플러그인) 만들기_4  (0) 2018.12.04
GraphQL 이란  (0) 2018.12.02
디자인 패턴 : MVC  (0) 2018.11.23
Vscode Extension (플러그인) 만들기_3  (0) 2018.11.23
Vscode Extension (플러그인) 만들기_2  (0) 2018.11.23
Comments