What is a model?

Introduction

A model is…

Models description

MVC

MVC (Model-View-Controller) is a pattern in software design commonly used to implement user interfaces, data, and controlling logic. It emphasizes a separation between the software’s business logic and display. This “separation of concerns” provides for a better division of labor and improved maintenance. Some other design patterns are based on MVC, such as MVVM (Model-View-Viewmodel), MVP (Model-View-Presenter), and MVW (Model-View-Whatever).

Model parts

An MVC software-design pattern is composed by three parts:

Model: manages data and business logic

The model defines what data the app should contain. If the state of thsi data changes, then the model will usually notify the view (so the display can change as needed) and sometimes the controller (if different logic is needed to control the updated view).

View: handles layout and display

The view defines how the app’s data should be displayed.

Controller: routes commands to the model and view parts

The controller contains logic that updates the model and/or view in response to input from the users of the app.

You might however also want to just update the view to display the data in a different format, e.g., change the item order to alphabetical, or lowest to highest price. In this case the controller could handle this directly without needing to update the model.

Model View controller example

From Mozilla.org:

Let’s define a simple shopping list app. What do we want to show? For each item in our shopping list, we want:

The name of the item
The quantity of the item to buy
The price of the item

The following diagram describes required functionalities and how they are implemented using MVC:

The model

The model would specify what data the list items should contain – item, price, etc. – and what list items are already present.

The following UML diagram is an example of the required data structure

classDiagram
    %% Define an Item class that contains the info of each item
    class Item {
        -String name
        -double price

        +getName() String
        +setName() void
        +getPrice() double
        +setPrice() void
        +equals() boolean
        +toString() String
    }

    %% Define a ShoppingList class to keep track of the items to buy
    class ShoppingList {
        +printList() void
        +getItemAmount(Item newItem) int
        +getItemPrice(Item newItem) double
        +getTotalPrice() double
        +addItem(Item newItem, int initialAmount) void
        +increaseAmountOfItem(Item item, int amount) void
    }

    %% Classes relationships
    Item "*" o-- "1" ShoppingList : contains

The View

In our shopping list app, the view would define how the list is presented to the user, and receive the data to display from the model.

The following UML diagram is an example of the expected user interface:

classDiagram
    class UserInterface {
    }

    %% Define a ShoppingView class that has the View design, its layout, its UI elements, etc...
    class ShoppingView {
        +getView() Scene
    }

    %% Classes relationships
    ShoppingView "1" o-- "1" UserInterface : uses

The Controller

Our shopping list could have input forms and buttons that allow us to add or delete items. These actions require the model to be updated, so the input is sent to the controller, which then manipulates the model as appropriate, which then sends updated data to the view.

The following UML diagram is an example of the expected controller

TODO

Add the UML diagram of the shopping list controller

MVC on the web

The Model

The data model is probably contained in some kind of database

The View

The User Interface is probably written using HTML/CSS/whatever else you like, but Java can also do frontend.

The Controller

The app’s controlling code is probably written in HTML/JavaScript, but Java can also implement it in the frontend.