
Model–view–controller (MVC) is a software
architectural pattern commonly used for developing
user interface
In the industrial design field of human–computer interaction, a user interface (UI) is the space where interactions between humans and machines occur. The goal of this interaction is to allow effective operation and control of the machine fro ...
s that divides the related program logic into three interconnected elements. These elements are:
* the
model
A model is an informative representation of an object, person, or system. The term originally denoted the plans of a building in late 16th-century English, and derived via French and Italian ultimately from Latin , .
Models can be divided in ...
, the internal representations of information
* the view, the interface that presents information to and accepts it from the user
* the controller, the software linking the two.
Traditionally used for desktop
graphical user interface
A graphical user interface, or GUI, is a form of user interface that allows user (computing), users to human–computer interaction, interact with electronic devices through Graphics, graphical icon (computing), icons and visual indicators such ...
s (GUIs), this pattern became popular for designing
web application
A web application (or web app) is application software that is created with web technologies and runs via a web browser. Web applications emerged during the late 1990s and allowed for the server to dynamically build a response to the request, ...
s. Popular programming languages have MVC frameworks that facilitate the implementation of the pattern.
__TOC__
History
One of the seminal insights in the early development of graphical user interfaces, MVC became one of the first approaches to describe and implement software constructs in terms of their
responsibilities.
Trygve Reenskaug created MVC while working on
Smalltalk
Smalltalk is a purely object oriented programming language (OOP) that was originally created in the 1970s for educational use, specifically for constructionist learning, but later found use in business. It was created at Xerox PARC by Learni ...
-79 as a visiting scientist at the Xerox
Palo Alto Research Center (PARC) in the late 1970s.
[Notes and Historical documents](_blank)
from Trygve Reenskaug, inventor of MVC.["A note on DynaBook requirements", Trygve Reenskaug, 22 March 1979]
SysReq.pdf
He wanted a pattern that could be used to structure any program where users interact with a large, convoluted
data set
A data set (or dataset) is a collection of data. In the case of tabular data, a data set corresponds to one or more table (database), database tables, where every column (database), column of a table represents a particular Variable (computer sci ...
. His design initially had four parts:
Model
A model is an informative representation of an object, person, or system. The term originally denoted the plans of a building in late 16th-century English, and derived via French and Italian ultimately from Latin , .
Models can be divided in ...
, view, thing, and editor. After discussing it with the other Smalltalk
developers, he and the rest of the group settled on model, view, and controller instead.
In their final design, a model represents some part of the program purely and intuitively. A view is a visual representation of a model, retrieving data from the model to display to the user and passing requests back and forth between the user and the model. A controller is an organizational part of the user interface that lays out and coordinates multiple Views on the screen, and which receives user input and sends the appropriate messages to its underlying Views. This design also includes an Editor as a specialized kind of controller used to modify a particular view, and which is created through that view.
Smalltalk-80 supports a version of MVC that evolved from this one.
It provides abstract
view
and
controller
classes as well as various concrete subclasses of each that represent different generic
widgets. In this scheme, a
View
represents some way of displaying information to the user, and a
controller
represents some way for the user to interact with a
view
. A
view
is also coupled to a model object, but the structure of that object is left up to the application
programmer
A programmer, computer programmer or coder is an author of computer source code someone with skill in computer programming.
The professional titles Software development, ''software developer'' and Software engineering, ''software engineer' ...
. The Smalltalk-80 environment also includes an "MVC Inspector", a development tool for viewing the structure of a given model, view, and controller side-by-side.
In 1988, an article in ''
The Journal of Object Technology'' (JOT) by two ex-PARC employees presented MVC as a general "
programming paradigm
A programming paradigm is a relatively high-level way to conceptualize and structure the implementation of a computer program. A programming language can be classified as supporting one or more paradigms.
Paradigms are separated along and descri ...
and methodology" for Smalltalk-80 developers. However, their scheme differed from both Reenskaug et al.'s and that presented by the Smalltalk-80 reference books. They defined a view as covering any graphical concern, with a controller being a more abstract, generally invisible object that receives user input and interacts with one or many views and only one model.
[ Also published as]
A Description of the Model–View–Controller User Interface Paradigm in the Smalltalk-80 System
(Report), ParcPlace Systems; Retrieved 2012-06-05.
The MVC pattern subsequently evolved,
from Martin Fowler. giving rise to variants such as
hierarchical model–view–controller (HMVC),
model–view–adapter (MVA),
model–view–presenter (MVP),
model–view–viewmodel (MVVM), and others that adapted MVC to different contexts.
The use of the MVC pattern in
web application
A web application (or web app) is application software that is created with web technologies and runs via a web browser. Web applications emerged during the late 1990s and allowed for the server to dynamically build a response to the request, ...
s grew after the introduction of
NeXT
NeXT, Inc. (later NeXT Computer, Inc. and NeXT Software, Inc.) was an American technology company headquartered in Redwood City, California that specialized in computer workstations for higher education and business markets, and later develope ...
's
WebObjects in 1996, which was originally written in
Objective-C
Objective-C is a high-level general-purpose, object-oriented programming language that adds Smalltalk-style message passing (messaging) to the C programming language. Originally developed by Brad Cox and Tom Love in the early 1980s, it was ...
(that borrowed heavily from Smalltalk) and helped enforce MVC principles. Later, the MVC pattern became popular with Java developers when WebObjects was ported to
Java
Java is one of the Greater Sunda Islands in Indonesia. It is bordered by the Indian Ocean to the south and the Java Sea (a part of Pacific Ocean) to the north. With a population of 156.9 million people (including Madura) in mid 2024, proje ...
. Later frameworks for Java, such as
Spring (released in October 2002), continued the strong bond between Java and MVC.
In 2003,
Martin Fowler published ''Patterns of Enterprise Application Architecture'', which presented MVC as a pattern where an "input controller" receives a request, sends the appropriate messages to a model object, takes a response from the model object, and passes the response to the appropriate view for display. This is close to the approach taken by the
Ruby on Rails web application framework (August 2004), which has the client send requests to the server via an in-
browser view, these requests are handled by a controller on the server, and the controller communicates with the appropriate model objects. The
Django framework (July 2005, for
Python) put forward a similar "model-template-view" (MTV) take on the pattern, in which a view retrieves data from models and passes it to templates for display. Both Rails and Django debuted with a strong emphasis on rapid deployment, which increased MVC's popularity outside the traditional enterprise environment in which it has long been popular.
Components
Model
The central component of the pattern. It is the application's dynamic
data structure
In computer science, a data structure is a data organization and storage format that is usually chosen for Efficiency, efficient Data access, access to data. More precisely, a data structure is a collection of data values, the relationships amo ...
, independent of the user interface. It directly manages the data, logic and rules of the application. In Smalltalk-80, the design of a model type is left entirely to the programmer. With WebObjects, Rails, and Django, a model type typically
represents a table in the application's
database
In computing, a database is an organized collection of data or a type of data store based on the use of a database management system (DBMS), the software that interacts with end users, applications, and the database itself to capture and a ...
. The model is essential for keeping the data organized and consistent. It ensures that the application's data behaves according to the defined rules and logic.
View
Any representation of information such as a
chart
A chart (sometimes known as a graph) is a graphics, graphical representation for data visualization, in which "the data is represented by symbols, such as bars in a bar chart, lines in a line chart, or slices in a pie chart". A chart can repres ...
, diagram or table. Multiple views of the same information are possible, such as a bar chart for management and a tabular view for
accountants.
In Smalltalk-80, a view is just a visual representation of a model, and does not handle user input. With WebObjects, a view represents a complete user interface element such as a menu or button, and does receive input from the user. In both Smalltalk-80 and WebObjects, however, views are meant to be general-purpose and
composable.
With Rails and Django, the role of the view is played by
HTML
Hypertext Markup Language (HTML) is the standard markup language for documents designed to be displayed in a web browser. It defines the content and structure of web content. It is often assisted by technologies such as Cascading Style Sheets ( ...
templates, so in their scheme a view specifies an in-browser user interface rather than representing a user interface widget directly. (Django opts to call this kind of object a "template" in light of this.) This approach puts relatively less emphasis on small, composable views; a typical Rails view has a
one-to-one relationship with a controller action.
Smalltalk-80 views communicate with both a model and a controller, whereas with WebObjects, a view talks only to a controller, which then talks to a model. With Rails and Django, a view/template is used by a controller/view when preparing a response to the client.
Controller

Accepts input and converts it to commands for the model or view.
A Smalltalk-80 controller handles user input events, such as button presses or mouse movement. At any given time, each controller has one associated view and model, although one model object may hear from many different controllers. Only one controller, the "active" controller, receives user input at any given time; a global
window manager
A window manager is system software that controls the placement and appearance of window (computing), windows within a windowing system in a graphical user interface. Most window managers are designed to help provide a desktop environment. They ...
object is responsible for setting the current active controller. If user input prompts a change in a model, the controller will signal the model to change, but the model is then responsible for telling its views to update.
In WebObjects, the views handle user input, and the controller mediates between the views and the models. There may be only one controller per application, or one controller per window. Much of the application-specific logic is found in the controller.
In Rails, requests arriving at the on-server application from the client are sent to a "router", which maps the request to a specific method of a specific controller. Within that method, the controller interacts with the request data and any relevant model objects and prepares a response using a view. Conventionally, each view has an associated controller; for example, if the application had a
client
view, it would typically have an associated
Clients
controller as well. However, developers are free to make other kinds of controllers if they wish.
Django calls the object playing this role a "view" instead of a controller.
A Django view is a function that receives a web request and returns a web response. It may use templates to create the response.
Interactions
In addition to dividing the application into a model, a view and a controller component, the MVC
design pattern defines the interactions between these three components :
[Buschmann, Frank (1996) ''Pattern-Oriented Software Architecture''.]
* The model is responsible for managing the data of the application. It receives user input from the controller.
* The view renders presentation of the model in a particular format.
* The controller responds to the user input and performs interactions on the data model objects. The controller receives the input, optionally validates it and then passes the input to the model.
As with other software patterns, MVC expresses the "core of the solution" to a problem while allowing it to be adapted for each system.
[Gamma, Erich et al. (1994) ''Design Patterns''] Particular MVC designs can vary significantly from the traditional description here.
Motivation
As
Alan Kay wrote in 2003, the original motivation behind the MVC was to allow creation of a graphical interface for any object.
That was outlined in detail in Richard Pawson's book ''
Naked Objects''.
Trygve Reenskaug, originator of MVC at PARC, has written that "MVC was conceived as a general solution to the problem of users controlling a large and complex data set."
In their 1991 guide ''Inside Smalltalk'',
Carleton University
Carleton University is an English-language public university, public research university in Ottawa, Ontario, Canada. Founded in 1942 as Carleton College, the institution originally operated as a private, non-denominational evening college to se ...
computer science professors Wilf LaLonde and John Pugh described the advantages of Smalltalk-80-style MVC as:
* independence of presentation and data, e.g. multiple views on one model simultaneously,
* composable presentation widgets, e.g. one view used as a subview of another,
* switchable input modes, by swapping one controller out for another during
runtime, and
* independence of input and output processing, via the
separate responsibilities of controllers and views.
Use in web applications
Although originally developed for
desktop computing, MVC has been widely adopted as a design for
World Wide Web
The World Wide Web (WWW or simply the Web) is an information system that enables Content (media), content sharing over the Internet through user-friendly ways meant to appeal to users beyond Information technology, IT specialists and hobbyis ...
applications in major
programming language
A programming language is a system of notation for writing computer programs.
Programming languages are described in terms of their Syntax (programming languages), syntax (form) and semantics (computer science), semantics (meaning), usually def ...
s. Several
web framework
A web framework (WF) or web application framework (WAF) is a software framework that is designed to support the development of web applications including web services, web resources, and web APIs. Web frameworks provide a standard way to build a ...
s have been created that enforce the pattern. These
software framework
In computer programming, a software framework is a software abstraction that provides generic functionality which developers can extend with custom code to create applications. It establishes a standard foundation for building and deploying soft ...
s vary in their interpretations, mainly in the way that the MVC responsibilities are divided between the
client and server.
Early MVC frameworks took a
thin client
In computer networking, a thin client, sometimes called slim client or lean client, is a simple (low-Computer performance, performance) computer that has been Program optimization, optimized for Remote desktop, establishing a remote connectio ...
approach that placed almost the entire model, view and controller logic on the server. In this approach, the client sends
hyperlink
In computing, a hyperlink, or simply a link, is a digital reference providing direct access to Data (computing), data by a user (computing), user's point and click, clicking or touchscreen, tapping. A hyperlink points to a whole document or to ...
requests or
form submissions to the controller and then receives a complete and updated
web page
A web page (or webpage) is a World Wide Web, Web document that is accessed in a web browser. A website typically consists of many web pages hyperlink, linked together under a common domain name. The term "web page" is therefore a metaphor of pap ...
(or other document) from the view; the model exists entirely on the server.
Later frameworks have allowed the MVC components to execute partly on the client, using
Ajax to synchronize data.
See also
References
Bibliography
{{DEFAULTSORT:Model-view-controller
Architectural pattern (computer science)
Software design patterns