[Web] MVC 패턴

344th·2024년 2월 9일

Develop

목록 보기

3/8

MVC

MVC(모델-뷰-컨트롤러)
: 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴
: 어플리케이션을 세 개의 영역으로 분할하고 각 구성 요소에게 고유한 역할을 부여하는 개발 방식

소프트웨어의 비즈니스 로직과 화면을 구분하는데 중점을 두고 있다. 이러한 "관심사 분리" 는 더나은 업무의 분리와 향상된 관리를 제공한다. MVC 에 기반을 둔 몇 가지 다른 디자인 패턴으로 MVVM (모델-뷰-뷰모델), MVP (모델-뷰-프리젠터), MVW (모델-뷰-왓에버)가 있다. MVC 패턴을 도입하면 도메인(비즈니스 로직) 영역과 UI 영역이 분리되므로 서로 영향을 주지 않고 유지보수가 가능하다.

MVC 소프트웨어 디자인 패턴의 세 가지 부분은 다음과 같이 설명할 수 있다.

모델: 데이터와 비즈니스 로직을 관리
뷰: 레이아웃과 화면을 처리
컨트롤러: 모델과 뷰로 명령을 전달

모델-뷰-컨트롤러 구조

MVC 패턴은 이름에서도 알 수 있듯이 모델(Model), 뷰(View), 컨트롤러(Controller) 세 개의 컴포넌트로 이루어진다. 각 컴포넌트는 고유한 역할을 수행한다.

모델(Model)

데이터 가공을 책임지는 컴포넌트(Component)이다.

모델은 어플리케이션의 정보, 데이터를 나타낸다. 데이타베이스, 초기화 된 상수나 값, 변수 등을 뜻한다. 비즈니스 로직을 처리한 후 모델의 변경 사항을 컨트롤러와 뷰에 전달한다.

모델은 다음과 같은 규칙을 가지고 있다.

사용자가 편집하길 원하는 모든 데이터를 가지고 있어야 한다.
뷰나 컨트롤러에 대해서 어떤 정보도 알지 말아야 한다.
변경이 일어나면, 변경 통지에 대한 처리 방법을 구현해야만 한다.

뷰(View)

사용자에게 보여지는 부분, 즉 유저 인터페이스(User interface)를 의미한다.

MVC 패턴은 여러 개의 뷰가 존재할 수 있으며, 모델에게 질의하여 데이터를 전달받는다. 뷰는 받은 데이터를 화면에 표시해주는 역할을 가지고 있다. 모델에게 전달받은 데이터를 별도로 저장하지 않아야 한다. 사용자가 화면에 표시된 내용을 변경하게 되면 모델에게 전달하여 모델을 변경해야 한다.

뷰는 다음과 같은 규칙을 가지고 있다.

모델이 가지고 있는 정보를 따로 저장해서는 안된다.
모델이나 컨트롤러와 같이 다른 구성 요소들을 몰라야 한다.
변경이 일어나면 변경통지에 대한 처리방법을 구현해야 한다.

컨트롤러(Controller)

모델과 뷰 사이를 이어주는 브릿지(bridge) 역할을 의미한다.

모델이나 뷰는 서로의 존재를 모르고 있다. 변경 사항을 외부로 알리고 수신하는 방법만 있다. 컨트롤러는 이를 중재하기 위한 컴포넌트이다. 모델과 뷰에 대해 알고 있으며 모델이나 뷰로부터 변경 내용을 통지 받으면 이를 각 구성 요소에게 통지한다. 사용자가 어플리케이션을 조작하여 발생하는 변경 이벤트들을 처리하는 역할을 수행한다.

컨트롤러는 다음과 같은 규칙을 가지고 있다.

모델이나 뷰에 대해서 알고 있어야 한다.
모델이나 뷰의 변경을 모니터링 해야 한다.

MVC 패턴의 필요성

유지보수의 편리성

MVC는 역할에 따라 확실하게 분리하여 유지보수를 용이하게 그리고 프로그램의 확장성과 유연성을 높인다.

데이터가 추가되면 Model 부분만 수정하고, UI가 수정되면 View 부분만 수정한다. 기존의 메인 다이얼로그/폼에서의 무분별한 하드 코딩이 필요없도록 한다.

최초 설계를 꼼꼼하게 진행한 시스템이라도 유지 보수가 발생하기 시작하면 각 기능간의 결합도(coupling)가 높아진다. 결합도가 높아진 시스템은 유지보수 작업 시 다른 비즈니스 로직에 영향을 미치게 되므로 사소한 코드의 변경이 의도치 않은 버그를 유발한다.

디자인 패턴이란 개발하는 과정에서 마주치는 문제들을 해결하기 위한 방법들이다. 선배 개발자들은 이런 문제점을 해결하기 위해 UI 시스템을 위한 책임을 기준으로 3개의 핵심 컴포넌트 모델, 뷰, 컨트롤러라는 책임을 나눈 것이다. 각 컴포넌트가 자신의 수행 결과를 다른 컴포넌트에게 전달하는 프로그래밍 방식으로 결합도를 낮췄다. 시스템 유지보수 시에도 특정 컴포넌트만 수정하면 되기 때문에 보다 쉬운 시스템 변경이 가능하다.

화면의 변경은 뷰를 수정하여 반영한다.
데이터나 비즈니스 요건이 변경은 모델을 수정하여 반영한다.
뷰와 모델 변경에 따른 컨트롤러를 수정한다.

MVC 패턴의 한계

MVC 패턴에도 한계가 존재한다. 복잡한 대규모 프로그램의 경우 다수의 뷰와 모델이 컨트롤러를 통해 연결되기 때문에 컨트롤러가 불필요하게 커지는 현상이 발생한다. 복잡한 화면을 구성하는 경우에도 동일한 현상이 발생하는데 이를 'Massive-View-Controller' 라고 한다. 이런 문제점을 보완하기 위해 다양한 패턴이 파생되었다.

MVP 패턴
MVVM 패턴
Flux
Redux
RxMVVM

Massive-View-Controller

MVC 구동 원리

C/S(Client - Server)구조로 요청을 하면 그에 맞는 응답을 하는 구조를 기본으로 하고 있다.

웹 브라우저가 웹 서버에 웹 애플리케이션 실행을 요청한다. (MVC 구조가 WAS라고 보면 된다.)
웹 서버는 들어온 요청을 처리할 수 있는 서블릿을 찾아서 요청을 전달한다. (Matching)
서블릿은 모델 자바 객체의 메서드를 호출한다.
데이터를 가공하여 값 객체를 생성하거나, JDBC를 사용하여 데이터베이스와의 인터랙션을 통해 값 객체를 생성한다.
업무 수행을 마친 결과값을 컨트롤러에게 반환한다.
컨트롤러는 모델로부터 받은 결과값을 View에게 전달한다.
JSP는 전달받은 값을 참조하여 출력할 결과 화면을 만들고 컨트롤러에게 전달한다.
뷰로부터 받은 화면을 웹 서버에게 전달한다.
웹 브라우저는 웹 서버로부터 요청한 결과값을 응답받으면 그 값을 화면에 출력한다.

MVC 방식의 종류

MVC패턴에는 Model 1 방식과 Model 2 방식이 있는데 특히 Model 2 구조 기반의 MVC 패턴 구현은 JSP 개발자라면 무조건 알고 있어야할 개발 방식이라고 한다.

Model 1

Controller와 프레젠테이션 영역(View)을 같이 구현하는 방식이다.

사용자의 요청을 JSP가 전부 다 처리한다. 웹 브라우저 사용자의 요청을 받은 JSP는 자바빈이나 서비스 클래스를 사용하여 웹 브라우저가 요청한 작업을 처리하고 그 결과를 출력해준다.

Model 2

Controller와 프레젠테이션 영역이 분리되어 있는 구현 방식이다.웹 브라우저 사용자의 요청을 Servlet이 받는다. Servlet은 요청을 View로 보여줄 것인지, Model로 보내줄 것인지 정하여 전송한다. 여기서 View 페이지는 사용자에게 보여주는 역할만 담당하고 실질적인 기능의 부분은 Model에서 담당한다.