MVC 패턴(Model View Controller Pattern)

MVC 패턴

 

- 자주 일어나는 현상에 대해 2개 이상의 디자인 패턴을 조합하는 대표적인 복합(Compound) 패턴이다.

- System 혹은 Program의 가장 초기에 구조를 잡아 아키텍처 결정을 할 때 이용하는 Architecture 패턴이다.

 

Model : 어플리케이션 로직, object같은 것들을 의미한다.

사용자가 편집하길 원하는 모든 데이터를 가지고 있어야 한다.

뷰나 컨트롤러에 대해서 어떤 정보도 알지 말아야 한다.

변경이 일어나면, 변경 통지에 대한 처리방법을 구현해야만 한다.

 

View : 실제 User interaction이 일어나는 곳을 의미한다.(UI)

즉, 모델이 가지고 있는 정보를 따로 저장해서는 안된다.

모델이나 컨트롤러와 같이 다른 구성요소들을 몰라야 된다.

변경이 일어나면 변경통지에 대한 처리방법을 구현해야만 한다.

 

Controller : 유저의 Gesture를 감지하고 그에 따른 반응을 시키는 곳이다.(User input 처리를 담당한다.)

즉, 모델이나 뷰에 대해서 알고 있어야 한다.

모델이나 뷰의 변경을 모니터링 해야 한다.

 

 

MVC Structure

 

 

 

 

예제를 통해 이를 좀더 자세히 알아보자.

 

 

 

 

 

 

** MVC Pattern**

 

Model은 가급적이면 나머지 Components의 상태를 알지 못하게 해야한다.

즉, 자신과 통신하는 것이 View, Controller인지도 모르게 해야한다.

왜냐하면 Model이 너무 많이 알고있다면 어떤 환경 변화가 생길시 해야하는 작업량이 급증하기 때문이다.

 

View나 Controller은 Model의 상태 변화에 대해 자세히 알아야 그것을 반영 할 수 있다.

 

View는 자신이 받은 Gesture를 Controller에게 위임한다.(User gestures 부분)

 

GUI 시스템을 만들 때 고려할 첫번째 디자인 패턴이 MVC 패턴이다.(Vue js를 생각해보면 MVC 패턴으로 되어있다.)

 

 

 

각 컴포넌트를 만들기 위한 디자인 패턴

 

Model - Observer Pattern

 

Model은 다른 컴포넌트를 잘 모르지만 View는 모델을 알게해야한다.

이를 가장 잘 나타내는 패턴은 Observer Pattern이다.

Model : Publisher, View : Subscriber

 

 

View - Composite Pattern

 

View widget들은 nested 하게 만들어야 한다.

(HTML을 생각해보면 쉽다. <div> 속에 <div>가 있고 그 속에 <a>가 있고 나란히 <p>가 있는 것처럼)

이를 가장 잘 나타내는 패턴은 Composite Pattern이다.

컴포지트 패턴은 복합 계층적인 것들을 나타내기에 용이하다.

 

Controller - Strategy Pattern

 

View가 Controller에게 gesture를 위임(delegate)한다.

따라서 이를 가장 잘 나타내는 패턴은 Strategy Pattern이다.

 

 

 

MVC 패턴 코드 구현

 

MVCMain 클래스

model, view, controller을 모두 생성한다. updateView에서는 통해 옵저버 패턴을 보이고 있다.

package MVCPattern;

public class MVCMain {

	public static void main(String[] args) {
		CharacterModel model = new CharacterModel("Crocus", 20, 3);		
		CharacterView view = new CharacterView();		
		CharacterController controller = new CharacterController(model, view);
		controller.updateView();

		controller.setCharacterLevel(controller.getCharacterLevel() + 1);
		controller.updateView();
		
		controller.setCharacterLife(controller.getCharacterLife() + 10);
		controller.updateView();
	}

}

 

 

 

CharacterModel 클래스

Model은 모든 상태를 가지고, 관리해야 한다.

package MVCPattern;

public class CharacterModel {
	private String name;
	private int level;
	private int life;
	
	public CharacterModel(String name, int level, int life) {
		this.name = name;
		this.level = level;
		this.life = life;
	}
	
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	
	public int getLevel() {
		return level;
	}
	public void setLevel(int level) {
		this.level = level;
	}
	
	public int getLife() {
		return life;
	}
	public void setLife(int life) {
		this.life = life;
	}
}

 

 

 

CharacterView 클래스

UI에 관련된 기능을 가지고 있다.

package MVCPattern;

public class CharacterView {
	// State query
	public void printView(CharacterModel model) {
		System.out.println("Name :: " + model.getName());
		System.out.println("Level :: " + model.getLevel());
		System.out.println("Life :: " + model.getLife());
	}
}

 

 

 

CharacterController 클래스

위의 MVC Structure에서 나타난 기능들을 포함하고 있다.(주석 참고)

package MVCPattern;

public class CharacterController {
	private CharacterModel model;
	private CharacterView view;
	
	public CharacterController(CharacterModel model, CharacterView view) {
		this.model = model;
		this.view = view;
	}

	// State change
	public void setCharacterName(String name) {
		model.setName(name);
	}	
	public String getCharacterName() {
		return model.getName();
	}
	
	// State change
	public void setCharacterLevel(int level) {
		model.setLevel(level);
	}
	public int getCharacterLevel() {
		return model.getLevel();
	}

	// State change
	public void setCharacterLife(int life) {
		model.setLife(life);
	}
	public int getCharacterLife() {
		return model.getLife();
	}
	
	// View selection(Rendering)
	public void updateView() {
		view.printView(model);
	}
}

 

 

 

MVC 패턴 특징

 

변화가 자주 일어나는 지점을 Model이 잘 알지 못하게 하여 Coupling을 감소시키는 것이 Point이다.

만약 직접 MVC 패턴을 이용했다고 했을 때 model 부분을 다른 UI를 위해 Support가능한지 테스트 해보면 MVC 패턴의 완성도를 가늠 할 수 있다.

즉, View, Controller 두개를 교체해도 Model이 변하지 않았다면 MVC 패턴의 완성도가 높은 것이다.

 

그리고 MVC 패턴을 사용하면 서로 분리되어 각자의 역할에 집중할 수 있게끔하여 개발을 하고 그렇게 애플리케이션을 만든다면, 유지보수성, 애플리케이션의 확장성, 그리고 유연성이 증가하고, 중복코딩이라는 문제점 또한 사라지게 된다.