# Model-View-ViewModel (MVVM) pattern as an architectural pattern

The MVVM pattern is a common architectural approach in WPF applications. It separates application logic (**Model**), the user interface (**View**), and binding logic (**ViewModel**)

<figure><img src="/files/eGvYqJyPTJ9YTbVKk2Dp" alt=""><figcaption><p>Figure 1: The MVVM pattern for separating application layers.</p></figcaption></figure>

**Model** represents the business logic and data of the application. It is independent of the user interface and does not know how the data is presented. **View** is the user interface and describes how the data is displayed. It mainly consists of XAML and defines the layout and visual elements of the application. It is bound to the ViewModel. Examples of view content are XAML files that define layouts and UI elements such as Buttons, Text Boxes, and Lists. The **ViewModel** acts as a link between the View and Model. It contains the binding logic and commands that enable interaction between the user interface and the model. The ViewModel presents the Model's data in a form suitable for binding to the View and responds to user interactions by executing commands. It implements the `INotifyPropertyChanged` interface to send notifications of data changes to the View and contains commands to process user actions.

The goal is to migrate without fundamentally changing the application layers.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://www.learnwisej.net/legacy-migration-with-wisej.net/hands-on-migrate-wpf-solutions-into-native-web-based-single-page-applications/model-view-viewmodel-mvvm-pattern-as-an-architectural-pattern.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.