CS 지식/개발 상식

MVC vs MVVM

naksnaks 2023. 2. 9.
반응형

MVC vs MVVM

아키텍처 패턴이란?

  • 소프트웨어 시스템의 기본 구조와 그러한 구조 및 시스템을 만드는 분야
  • 각 구조는 소프트웨어 요소, 이들 간의 관계, 요소와 관계의 속성으로 구성
  • 시스템 및 개발 프롲게트의 청사진 역할을 하며 설계 팀이 실행하는 데 필요한 작업을 제시함

MVC 패턴

MVC 패턴은 Model + View + Controller를 합친 용어입니다.

MVC 패턴

Model : 어플리케이션에서 사용되는 데이터와 그 데이터를 처리하는 부분입니다.
View : 사용자에게 보여지는 UI 부분입니다.
Controller : 사용자의 입력을 받고 처리하는 부분입니다.

순서

  1. 사용자들의 입력이 Controller에 들어오게 됩니다.
  2. Controller는 사용자의 입력을 확인하고, Model을 업데이트 합니다.
  3. Controller는 Model을 나타내줄 View를 선택합니다.
  4. View는 Model을 이용하여 화면을 나타냅니다.

특징

  • Controller는 여러 개의 View를 선택할 수 있는 1:N 구조입니다.
  • View는 Controller를 알지 못합니다.

장점

  • 가장 단순하기 때문에 보편적으로 사용되는 디자인 패턴입니다.
  • 데이터를 가공 없이 리턴한다.
  • 변경사항이 전체 모델에 영향을 주지 않는다.

단점

  • View와 Model 사이의 의존성이 높습니다. 의존성이 높아지면 어플리케이션이 커질수록 복잡해지고, 유지보수가 어렵습니다.

MVVM 패턴

MVVM은 Model + View + View Model을 합친 용어입니다.

MVVM 패턴 구조

Model : 어플리케이션에서 사용되는 데이터와 그 데이터를 처리하는 부분입니다.
View : 사용자에게 보여지는 UI 부분입니다.
View Model : View를 표현하기 위해 만든 View를 위한 Model입니다. View를 나타내주기 위한 Model이자 View를 나타내기 위한 데이터 처리를하는 부분입니다.

순서

  1. 사용자들의 입력들은View를 통해 들어옵니다.
  2. View에 입력이 들어오면, Command 패턴으로 View Model에 입력을 전달합니다.
  3. View Model은 Model에게 데이터를 요청합니다.
  4. Model은 View Model에게 요청받은 데이터를 응답합니다.
  5. View Model은 응답 받은 데이터를 가공하여 저장합니다.
  6. View는 View Model과 Data Binding하여 화면을 나타냅니다.

특징

  • Command 패턴과 Data Binding 두 가지 패턴을 이용해 구현됩니다.
  • 이 두 가지 패턴을 이용하여 View 와 View Model 사이의 의존성을 없앴습니다.
  • View Model과 View 의 관계는 1:N 관계입니다.

장점

  • 테스트 용이성 : MVVM 아키텍처에서 모든 코드는 알갱이성(granular)을 유지합니다.
  • 확장성 : 코드를 모듈화 하여 유지보수성을 얻게 됩니다.
  • 뷰를 추상화해서 비즈니스 로직 뒤에 있는 코드가 줄어듭니다.
  • 각각의 부분이 독립적이라 모듈화하여 개발할 수 있습다.

단점

  • View Model의 설계가 쉽지 않다.

참조
devowen - MVC, MVP 그리고 MVVM 패턴에 대하여https://devowen.com/457
버미노트 - MVC, MVP, MVVM 비교https://beomy.tistory.com/43

반응형

'CS 지식 > 개발 상식' 카테고리의 다른 글

함수형 프로그래밍(Functional Programming)  (0) 2023.02.06
Git 과 Github  (0) 2023.02.02
애자일 (Agile)  (0) 2023.01.26
RESTful API란?  (0) 2023.01.26
OOP(객체 지향 프로그래밍)  (2) 2023.01.26

댓글

💲 추천 글