In UI development, we can split it into 3 components as following;

1. View (UI)
2. Model (Business Logic and Data Displayed in UI)
3. Glue code (Event handling, binding)

Separation of Concerns

Here's the keyword on why we would like to use MVVM. We want to separate these component(View, Model, and Glue Code) out of each other and make it loosedly coupling between each other.

What is MVVM

MVVM is one of the pattern that attempt to make a separation of concern by isolating the glue code into it's compont called ViewModel.

The MVVM pattern includes three key parts:

1. Model (Business rule, data access, model classes) 
2. View (User interface (XAML)) 
3. ViewModel (Agent or middle man between view and model)

Outline

1. Understanding the basics of MVVM design pattern
2. WPF MVVM step by step (Basics to Advance Level)
3. MVC MVP MVVM คืออะไร และต่างกันอย่างไร
4. edX - Microsoft: DEV209.2x - Developing Windows 10 Universal Apps