Day 79 · 1/5
🌳 고급 architecture

MVC와 MVVM 패턴이 뭔가요?

쉽게 이해하기

레스토랑을 운영할 때 주방(요리), 홀(서빙), 계산대(결제)를 분리하는 것처럼, 코드도 데이터 처리, 화면 표시, 사용자 입력 처리를 나눠서 관리하면 각자 역할이 명확해지고 유지보수가 쉬워집니다. MVC와 MVVM은 이런 분리 방식의 대표적인 패턴입니다.

핵심 정리

코드를 역할별로 나눠서 관리하는 대표적인 설계 방식입니다.

자세히 알아보기

MVC는 Model-View-Controller의 약자로, 애플리케이션을 세 가지 역할로 나눕니다. Model은 데이터와 비즈니스 로직을 담당하고, View는 사용자에게 보이는 화면을 담당하며, Controller는 사용자 입력을 받아서 Model과 View를 연결합니다. 예를 들어 게시판 앱에서 Model은 게시글 데이터를 다루고, View는 게시글 목록을 화면에 그리며, Controller는 '작성 버튼 클릭' 같은 이벤트를 처리합니다. MVVM은 Model-View-ViewModel의 약자로, MVC와 비슷하지만 ViewModel이라는 개념이 추가됩니다. ViewModel은 View를 위한 데이터를 준비하고, View와 Model 사이의 데이터 바인딩을 자동으로 처리합니다. React나 Vue 같은 최신 프레임워크는 MVVM 패턴에 가까운데, 데이터가 바뀌면 자동으로 화면이 업데이트되는 반응형 시스템이 대표적인 예입니다. 실무에서는 프로젝트 규모가 커질수록 이런 패턴의 중요성이 커집니다. 패턴을 따르면 '이 코드는 어디에 써야 하지?'라는 고민이 줄어들고, 팀원들이 코드 구조를 쉽게 이해할 수 있습니다. 예를 들어 API 호출 로직은 Model에, 버튼 클릭 처리는 Controller나 ViewModel에 두는 식으로 역할이 명확해집니다. MVC는 전통적인 웹 프레임워크(Django, Ruby on Rails)에서 많이 쓰이고, MVVM은 프론트엔드 중심의 SPA(Single Page Application)에서 선호됩니다. 둘 다 '관심사의 분리(Separation of Concerns)'라는 원칙을 따르며, 코드의 재사용성과 테스트 용이성을 높이는 데 목적이 있습니다. 처음에는 복잡해 보일 수 있지만, 패턴을 따르면 장기적으로 코드 품질이 크게 향상됩니다.