220708_MVC 모델

1. MVC (Model - View - Controller)

(1) 정의

• 사용자 인터페이스, 데이터 및 논리 제어를 구현하는데 널리 사용되는 소프트웨어 디자인 패턴

• 관심사 분리 : 소프트웨어의 비즈니스 로직과 화면을 구분하는데 중점을 둠

• MVC 기반의 다른 디자인 패턴
  ㄱ. MVVM(Model - View - View Model)
  ㄴ. MVP(Model - View - Presenter)
  ㄷ. MVW(Model - View - Whatever)

• 각 부분별 기능
  ㄱ. Model : 데이터와 비즈니스 로직을 관리
  ㄴ. View : 레이아웃과 화면을 처리
  ㄷ. Controller : 명령을 Model과 View 부분으로 라우팅(Routing) 함
  
  

(2) MVC 모델의 예시

• 쇼핑 리스트 앱이 있다고 가정을 했을 때
  ㄱ. 구입해야 할 품목의 이름, 개수, 가격의 목록이 필요
  ㄴ. 이 기능의 일부를 MVC를 사용해 구현한다면 다음과 같음

1) Model

• 앱이 포함해야 할 데이터가 무엇인지 정의
• 데이터의 상태 변경 시 모델은 일반적으로 뷰에게 알림 (필요한 대로 화면 변경)
• 때로는 컨트롤러에게도 알리기도 함 (업데이트 된 뷰를 제거하기 위해 다른 로직이 필요할 때)
• 리스트 항목이 포함해야 하는 데이터와 이미 존재하는 리스트 항목이 무엇인지를 지정

2) View

• 앱의 데이터를 보여주는 방식을 정의
• 항목이 사용자에게 보여지는 방식을 정의하며 표시할 데이터를 모델로부터 받음

3) Controller

• 앱의 사용자로부터의 입력에 대한 응답으로 Model 및 View를 업데이트하는 로직을 포함
• Model과 View를 모두 업데이트 해야 하거나 (쇼핑 리스트에 항목을 추가할 경우)
• View만 업데이트 할 경우 (쇼핑 리스트를 단순히 정렬만 할 경우) 등이 존재
  
  

(3) MVC 모델의 장점

• 기능별로 분리되어 있어 분업해서 작업 진행하기가 용이
• 기능 변경 및 수정이 진행될 경우 해당 영역 외 다른 영역에 영향을 끼치지 않음
  
  

(4) 웹에서의 MVC

• MVC 모델이 아니더라도 이미 웹에서는 비슷한 형태로 서비스를 무의식적으로 구현하고 있을 것
  ㄱ. 데이터 모델은 특정 종류의 DB에 저장됨 (서버 사이드, 클라이언트 사이드) = Model
  ㄴ. 앱의 제어 코드는 HTML,Javascript로 작성되었을 것 = Controller
  ㄷ. 앱의 사용자 인터페이스는 HTML/CSS로 작성되었을 것 = View

• 다만 MVC는 이러한 컴포넌트들을 더 엄격하게 관리하는 패턴이라고 할 수 있음
  
  

레퍼런스

https://developer.mozilla.org/ko/docs/Glossary/MVC
https://velog.io/@josworks27/MVC-%EB%AA%A8%EB%8D%B8-%EA%B0%9C%EB%85%90