Model View Controller

Definition

Model-View-Controller(a.k.a. MVC) is long-standing design pattern for user interfaces.

It has three important components:

• Model - is a data manager

• View - is what user can see

• Controller - Controller's definition is generally unclear.

  But let's define it clearly at here.

  Controller converts user's inputs to model commands.

By the above definition, this can be illustrated by following chart.

(from wikipedia)

The following one is not what we want:

Controller with bidirectional data flows makes a lot of side effects that programmers can not control.

So we just make unidirectional data flows for less side effects. Like Flux!

Data Flow

1. User makes an interaction, and Controller catch that as Event

2. Controller do some business logic (like HTTP request, database query, ...) and sends Actions to Model. (ex. IncreaseNumber, SaveUserList(users))

3. Model mutates the State based on Actions and notify the result of mutation View.

4. View renders State to something that user can see.

5. User makes an interaction, and Controller catch that as Event

6. And so on...

Combining

This is how we combine Model, View, Controller, and UserInteractable.

let eventStream = userInteractable.interact()
let actionStream = controller.use(eventStream)
let stateStream = model.manipulate(actionStream)
let disposable = view.update(stateStream)
disposable.addDisposableTo(disposeBag)

Summary

• Controller is a just stream transformer that converts Event stream to Action stream.

• Model is a just stream transformer that converts Action stream to State stream.

• View is a just subscriber that accepts State and renders it for User.

• User Interactable is a just stream that provides User's interaction as Event

These are basic idea of RxMVC. You can build any simple and complex applications without unpredictable side effects.

See the examples for more details.

Or see Tutorial.