React.JS의 Redux 관련 글을 포스팅하면서 그리고 MVC, MVP, MVVM 패턴에 관한 포스팅을 하면서 다른 디자인패턴에 관심을 가지게 되었습니다. Vuex는 Flux 패턴에 영감을 받아 만들어졌다고도 하고, Flux는 React.JS의 Redux의 디자인패턴이기도 합니다. Flux와 MVC를 비교하기 전에 [디자인패턴] MVC, MVP, MVVM 비교를 참고하시면 좀 더 이해하는데 도움이 될 것 같습니다. Flux는 MVC 모델의 단점을 보안하기 위해 페이스북에서 발표한 아키텍쳐입니다. 1. MVC 문제점 페이스북에서 이야기 하는 MVC의 가장 큰 단점은 양방향 데이터 흐름이었습니다. MVC 패턴에서 Controller는 Model의 데이터를 조회하거나 업데이트하는 역할을 합니다. Model..
Redux는 데이터를 효율적으로 관리 할 수 있게 해주는 아키텍쳐 입니다. 프로젝트의 규모가 커질 수록, 데이터가 복잡해 지는 자바스크립트 싱글 페이지 어플리케이션(Single Page Application)에서 매우 유용하게 사용 됩니다. Redux 공식 문서에는 Redux는 React 외에 다른 View 라이브러리와 함께 사용될 수 있다고 설명하고 있습니다. 저희는 React에 Redux를 적용해 보겠습니다. 1. Redux의 Data Flow 규모가 큰 프로젝트에서 Redux의 Data Flow는 코드를 명료하게 만드는 큰 장점을 가지고 있습니다. 스파게티 코드의 Data Flow 위와 같이 컴포넌트가 구성되어 있을 때, 주황색 컴포넌트의 state가 파란색 컴포넌트와 초록색 검포넌트에 전달되어야 ..