[CS] MVC 패턴, MVP 패턴, MVVM 패턴

MVC 패턴

MVC패턴은 모델(Model), 뷰(View), 컨트롤러(Controller)로 이루어진 디자인 패턴

 

 

모델 (Model)

모델(model)은 애플리케이션의 데이터인 데이터베이스, 상수, 변수 등을 뜻 함
뷰에서 데이터를 생성하거나 수정할 때 컨트롤러를 통해 모델이 생성 또는 업데이트 됨. 예를 들어 사용자가 네모박스에 글자를 적는다고 한다면, 이 때 모델은 네모박스의 크기정보, 글자내용, 글자의 위치, 글자의 포맷 정보 등이 됨

뷰 (View)

뷰(view)는 inputbox, checkbox, textarea 등 사용자 인터페이스 요소를 나타내며 모델을 기반으로 사용자가 볼 수 있는 화면을 뜻함. 모델이 가지고 있는 정보를 따로 저장하지 않아야 하며 변경이 일어나면 컨트롤러에 이를 전달해야 함

컨트롤러

컨트롤러(controller)는 하나 이상의 모델과 하나 이상의 뷰를 잇는 다리 역할을 하며 이벤트 등 메인 로직을 담당. 또한, 모델과 뷰의 생명주기도 관리하며, 모델이나 뷰의 변경 통지를 받으면 이를 해석하여 각각의 구성 요소에 해당 내용에 대해 알려줌

 

MVC 패턴의 장점

1. 애플리케이션의 구성 요소를 세 가지 역할로 구분하여 개발 프로세스에서 각각의 구성 요소에만 집중해서 개발할 수 있음
2. 재사용성과 확장성이 용이함

 

MVC 패턴의 단점

1. 애플리케이션이 복잡해질수록 모델과 뷰의 관계가 복잡해짐
2. MVC패턴을 반영한 대표적인 프레임워크로 Spring WEB MVC가 있음

 

Spring의 MVC 패턴 적용사례

 이 중에서 MVC 패턴이 적용된 Web모듈의 Spring Web MVC 확인

디스패처의 서블릿의 요청 처리 과정

Spring Web MVC의 MVC패턴은 디스패처 서블릿의 사용자 요청 처리 과정을 통해 알 수 있음

1. 클라이언트가 요청을 했을 때 가장 먼저 디스패처 서블릿이 이를 받음(프론트 컨트롤러 역할). 이 때 url 이나 form data 등 여러개의 데이터를 어떤 컨트롤러에게 이를 처리하게 결정하는 역할(ex: 공장의 반장) 보통 클래스이름, url, xml의 설정 등을 참고 할 수 있지만 보통 @requestmapping를 참고해서 함

@RequestMapping(value = "/ex/foos", method = POST)
@ResponseBody
public String postFoos() {
	return "Post some Foos";
}

2. 하나 이상의 handler mapping을 참고해서 적절한 컨트롤러를 설정. 이후 컨트롤러로 요청을 보냄
3. 컨트롤러는 데이터베이스에 접근하여 데이터를 가져오는 등 비즈니스 로직을 수행
4. 그렇게 해서 사용자에게 전달해야할 정보인 모델을 생성
5. 그 다음 뷰를 구현하기 위한 view resolver를 참고
6. 해당 정보를 기반으로 뷰를 렌더링
7. 응답 데이터를 보냄
 

 

MVP 패턴

C가 P(프레젠터, presenter) 로 교체된 패턴. V와 P는 1:1 관계이므로 MVC보다 더 강한 결합을 지닌 디자인 패턴

 

MVVM 패턴

MVC의 C가 VM(뷰모델, view model)로 바뀐 패턴. VM은 뷰를 추상화한 계층이며 VM : V = 1 : N 이라는 관계를 갖음

 

VM은 커맨드와 데이터 바인딩을 가짐
- 커맨드:여러요소에대한처리를하나의액션으로처리할수있는기법
- 데이터바인딩 : 화면에 보이는 데이터와 브라우저 상의 메모리 데이터를 일치시키는 방법
MVVM 패턴을 가진 대표적인 프레임워크로는 뷰(Vue.js)가 있음

 

차이점

특징	MVC 패턴	MVP 패턴	MVVM 패턴
관계	컨트롤러와 뷰는 1 : N	프레젠터와 뷰는 1 : 1	뷰모델과 뷰는 1 : N
참조	뷰는 컨트롤러를 참조 X	뷰는 프레젠터를 참조 O	뷰는 뷰모델을 참조 O

 

* 참고

- CS 지식의 정석 | 디자인패턴 네트워크 운영체제 데이터베이스 자료구조 -인프런