How to Model MVC Framework with UML Sequence Diagram

How to Model MVC Framework with UML Sequence Diagram?

3-4 minutes

MVC (or Model-view-controller) is a popular software framework for successfully and efficiently relating the user interface to underlying data models. Since the programming language Smalltalk first defined the MVC concept in the 1970s.

MVC Framework is common to think of an application as having three main layers: presentation (UI), application logic, and resource management. In MVC, the presentation layer is split into controller and view. The most important separation is between presentation and application logic. The View/Controller split is less so.

In other words, the model contains:

• The model (core functionality and data)
• Views display information to the user.
• Controllers handle user input.

Views and controllers together comprise the user interface. A change-propagation mechanism ensures consistency between the user interface and the model.

The model-view-controller pattern proposes three main components or objects to be used in software development:

• Model represents the underlying, logical structure of data in a software application and the high-level class associated with it. This object model does not contain any information about the user interface.
• View a collection of classes representing the elements in the user interface (all of the things the user can see and respond to on the screen, such as buttons, display boxes, and so forth)
• Controller represents the classes connecting the model and the view and is used to communicate between classes in the model and view.

MVC Framework has been widely used by many software developers and other software frameworks and libraries. Traditionally used for desktop graphical user interfaces(GUIs), this pattern has become popular for designing web applications. Popular programming languages like JavaScript, Python, Ruby, PHP, Java, and C # have MVC frameworks that are used in web application development straight out of the box.

A Generic MVC Sequence Diagram Example

In the generic MVC sequence diagram below, it shows the view object is responsible for user input and output, i.e. a dialog box is a good example of a view. A controller object implements the logic for the allowable transactions that can be performed on the model. The model object encapsulates the fine-grained business logic and data.

MVC Sequence Diagram Example: Hotel Reservation Fragment

This sequence diagram example shows how hotel reservations can be made. This sequence diagram captures the behavior of a single hotel reservation scenario by showing a number of example objects and the messages that are passed between these objects as shown in the diagram below: