Design pattern
UI(view)는 Domain(Model)에게 높은 의존성을 가진다.
클린아키텍쳐의
좋은코드
즉, 높은 응집도, 낮은 결합도, 간편/간결한 코드변경을 위하여 다양한 프레임 워크가 나오게 되었다.
의존성을 해소하고 코드의 재활용성을 높이기위한 디자인패턴(MVC,MVP,MVVM)을 알아보자.
View & Model
디자인패턴에서 분리는 Model과 View의 의존성을 제어
Model- UI와 Presenter를 제외한 모든 부분- 데이터(Data) & 데이터를 조작하는 간단한 로직
View- 사용자에게 제공되어지는 UI Layer (렌더된 화면)
MVC (Model View Controller)
Controller : 사용자의 액션확인 (버튼 눌림 감지 / 어떠한 기능인지 감지)(Controller 가 원하는 View 를 선택함)⬇️Model : Controller는 Model을 이용해 해당버튼이 어떤데이터를 보여줄지 선택⬇️View : Model을 통해 선택한 데이터를 어떤 View에 보여줄지 선정 후 화면에 나타냄(View 는 Controller 의 존재를 모름)
❗️사용법이 단순하고 보편적이지만 ❓ View와 Model 사이의 의존성이 높다
MVP (Model View)
View : 브라우저를 통해 사용자가 액션 감지(Model은 Model의 존재를 모름)⬇️Presenter : View의 데이터가 Presenter로 들어옴 / Presenter는 Model에게 데이터 요청⬇️Model : Model은 Presenter에게 요청 받은 데이터를 Presenter에게 전달(Model은 View의 존재를 모름)⬇️Presenter : Presenter는 Model에게 받은 데이터를 View에게 전달⬇️View : Presenter에게 받은 데이터로 브라우저에 나타냄
❗️View와 Model의 의존관계는 없지만 각각 Presenter와의 관계가 크다❓ View와Presenter의 일대일 관계로 인해,각 View 를 위한 각 Presenter 가 필요하게된다. (=코드수가 늘어남)
MVVM (Model View View Model)
View : 브라우저를 통해 사용자가 액션 감지⬇️View Model : View로 부터 Action에 해당하는 데이터 전달받음 / Model에게 데이터⬇️Model : 요청받은 데이터를 View Model에 응답(전달)⬇️View Model : Model로 부터 응답받은 데이터를 가공하여 저장(View로 가공한 데이터를 전달하는건 아님)⬇️View : View Model과 함께 Data Binding하여 화면을 나타낸다(Data Binding은 자동으로 이루어지지 않음)
❗️View와 Model 사이의 의존성이 없고, 독립적이기 때문에 모듈화 하여 개발가능❓View Model 설계가 어렵고 데이터 바인딩을 도와주는 라이브러리(ex. injector)를 함께 사용해야함
