[C#.NET] MVVM 패턴 개요 (XAML)

일반적으로 XAML에서 사용자 인터페이스를 만든 다음 사용자 인터페이스에서 작동하는 코드를 추가하는 작업이 포함됩니다. 앱이 수정되고 크기와 범위가 증가함에 따라 복잡한 유지 관리 문제가 발생할 수 있습니다. 이러한 문제에는 UI 컨트롤과 비즈니스 로직 간의 긴밀한 결합이 포함되어 있어 UI 수정 비용이 증가하고 이러한 코드를 단위 테스트하기가 어렵습니다.

MVVM(Model-View-View Model) 패턴은 앱의 비즈니스 및 프레젠테이션 로직을 사용자 인터페이스(UI)에서 명확하게 분리하는 데 도움이 됩니다. 앱 로직과 UI를 깔끔하게 분리하면 수많은 개발 문제를 해결하는 데 도움이 되며 앱을 더 쉽게 테스트하고 유지 관리하고 발전시킬 수 있습니다. 또한 코드 재사용 기회를 크게 향상할 수 있으며 개발자와 UI 디자이너가 앱의 각 부분을 개발할 때 더 쉽게 협업할 수 있습니다.

MVVM 패턴에는 모델, 뷰, 뷰 모델이라는 세 가지 핵심 구성 요소가 있습니다. 각각은 뚜렷한 목적을 가지고 있습니다. 다음 다이어그램은 세 가지 구성 요소 간의 관계를 보여줍니다.

각 구성 요소의 책임을 이해하는 것 외에도 상호 작용 방식을 이해하는 것도 중요합니다. 높은 수준에서, 뷰는 뷰 모델에 대해 알고, 뷰 모델은 모델에 대해 알지만, 모델은 뷰 모델을 인식하지 못하고, 뷰 모델은 뷰를 인식하지 못합니다. 따라서 뷰 모델은 뷰와 모델을 분리하고 모델이 뷰와 독립적으로 발전할 수 있도록 합니다.

MVVM을 효과적으로 사용하는 핵심은 앱 코드를 올바른 클래스로 구성하는 방법과 클래스가 상호 작용하는 방식을 이해하는 데 있습니다.

뷰는 사용자가 화면에서 보는 것의 구조, 레이아웃 및 모양을 정의하는 역할을 합니다. 이상적으로 각 뷰는 비즈니스 논리를 포함하지 않는 제한된 코드-숨김(Code-behind)을 사용하여 XAML로 정의됩니다. 그러나 경우에 따라 애니메이션과 같이 XAML로 표현하기 어려운 시각적 동작을 구현하는 UI 논리가 코드-숨김에 포함될 수 있습니다. (여기서 코드-숨김이란, 뷰는 XAML과 C# 코드로 구성됩니다. 이를 별개의 파일로 분리하여, 뷰의 제어 로직을 C# 코드에 별개로 구현함으로써 XAML를 간략히 유지하는 방법입니다.)

뷰 모델은 뷰가 데이터를 바인딩할 수 있는 속성과 명령을 구현하고 변경 알림 이벤트를 통해 상태 변경을 뷰에 알립니다. 뷰 모델이 제공하는 속성과 명령은 UI에서 제공할 기능을 정의하지만 해당 기능이 표시되는 방법은 뷰에 의해 결정됩니다.

뷰 모델은 또한 필요한 모델 클래스와 뷰의 상호 작용을 조정하는 역할도 합니다. 일반적으로 뷰 모델과 모델 클래스 사이에는 일대다 관계가 있습니다.

각 뷰 모델은 뷰가 쉽게 사용할 수 있는 형식으로 모델의 데이터를 제공합니다. 이를 달성하기 위해 뷰 모델은 때때로 데이터 변환을 수행합니다. 이 데이터 변환을 뷰 모델에 배치하는 것은 뷰가 바인딩할 수 있는 속성을 제공하므로 좋은 생각입니다. 

모델 클래스는 앱의 데이터를 캡슐화하는 비시각적 클래스입니다. 따라서 모델은 일반적으로 비즈니스 및 유효성 검사 논리와 함께 데이터 모델을 나타내는 것으로 생각할 수 있습니다.

끝.