Notice
Recent Posts
Recent Comments
Link
«   2025/05   »
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

스터디

MVC 패턴 본문

백엔드

MVC 패턴

_민영 2023. 4. 7. 00:19

< MVC >

> MVC(Model-View-Controller)는 애플리케이션을 세 가지 역할로 구분한 개발 방법론이다.

사용자가 Controller를 조작하면 Controller는 Model을 통해 데이터를 가져오고, 그 데이터를 바탕으로 View를 통해 시각적 표현을 제어하여 사용자에게 전달하게 된다.

이러한 패턴을 성공적으로 사용하면, 사용자 인터페이스로부터 비즈니스 로직을 분리하여 애플리케이션의 시작적 요소나 그 이면에서 실행되는 비즈니스 로직을 서로 영향 없이 쉽게 고칠 수 있는 애플리케이션을 만들 수 있게 된다.

https://cocoon1787.tistory.com/733

> MVC 패턴을 WEB에 적용 시

  1. 사용자가 웹사이트에 접속 (Users)
  2. Controller는 사용자가 요청한 웹페이지를 서비스하기 위해서 모델을 호출 (Manipulates)
  3. Model은 데이터베이스나 파일과 같은 데이터 소스를 제어한 후 그 결과를 Return
  4. Controller는 Model이 리턴한 결과를 View에 반영 (Updates)
  5. 데이터가 반영된 View는 사용자에게 보여짐 (Sees)

 

 

 

 

 

< 모델(Model) >

  • 데이터를 가진 객체를 모델이라고 지칭한다.
  • 데이터는 내부의 상태에 대한 정보를 가질 수도 있고, 모델을 표현하는 이름 속성으로 가질 수 있다.
  • 모델의 상태에 변화가 있을 때 컨트롤러와 뷰에 이를 통보한다.
  • 이와 같은 통보를 통해 뷰는 최신의 결과를 보여줄 수 있고, 컨트롤러는 모델의 변화에 따른 적용 가능한 명령을 추가, 제거, 수정할 수 있다.

 

> 모델의 규칙

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

 

 

 

 

< 뷰(View) >

  • View는 클라이언트 측 기술은 HTML/CSS/JavaScript들을 모아둔 컨테이너이다.
  • 사용자가 볼 결과물을 생성하기 위해 모델로부터 정보를 얻어온다.

 

> 뷰의 규칙

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

 

 

 

 

 

< 컨트롤러(Controller) >

  • 사용자가 접근한 URL에 따라 사용자의 요청 사항을 파악한 후에 그 요청에 맞는 데이터를 Model에 의뢰하고, 데이터를 View에 반영해서 사용자에게 알려준다.
  • 모델에 명령을 보냄으로써 뷰의 상태를 변경할 수 있다. (워드에서 문서 편집)
  • 컨트롤러가 관련된 모델에 명령을 보냄으로써 뷰의 표시 방법을 바꿀 수 있다. (문서를 스크롤하는 것)

 

> 컨트롤러의 규칙

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

 

 

 

 

 

< MVC 패턴을 사용해야 하는 이유 >

  • 비즈니스 로직과 UI 로직을 분리하여 유지보수를 독립적으로 수행이 가능하다.
  • Model과 View가 다른 컴포턴트들에 종속되지 않아 애플리케이션의 확장성, 유연성에 유리하다.
  • 중복 코딩의 문제점을 제거한다.

 

 

 

 

 

< 요약 >

  • Model: 백그라운드에서 동작하는 비즈니스 로직(데이터) 처리
  • View: 정보를 화면으로 보여주는 역할
  • Controller: 사용자의 입력 처리와 흐름 제어 담당. 화면과 Model과 View를 연결시켜주는 역할.

'백엔드' 카테고리의 다른 글

[JavaScript] 프로토타입과 클래스  (3) 2023.04.10
[JavaScript] 싱글톤 패턴과 정적 클래스  (0) 2023.04.07
[JavaScript] 동기? 비동기?  (0) 2023.04.06
[JavaScript] async/await  (0) 2023.04.06
JavaScript promise  (1) 2023.04.06