PHP MVC Tutorial: Understanding the Model-View-Controller

phpmvctutorialAs a computer science student, one of the first things you’ll learn is the ‘model-view-controller’, or MVC. MVC is a widely used software architecture pattern that informs the design of some of your favorite software applications. In this blog post, we’ll take a look at the MVC pattern in some more detail, especially how it is used in PHP.

If you’d rather just dive in and start creating your own apps, consider this course on PHP for code-phobes.

A Brief History of Model-View-Controller

Let’s go all the way back to the 70s. Man has been to the moon, the civil rights movement has been a huge success, and the counterculture revolution is in full swing. More importantly for us, computer science has now established itself as a legitimate field, not just the eccentric hobby of people with huge glasses and bigger beards. Some of the brightest minds in engineering and mathematics are collaborating in research labs at Stanford, Berkeley and the dozens of private companies like Xerox and HP in what would later become Silicon Valley.

It’s against this backdrop that a bunch of very talented programmers have gathered at the Learning Research Group (LRG) of Xerox PARC in Palo Alto, California (the current home of Apple). These programmers are Alan Kay, Dan Ingalls, Adele Goldberg, Ted Kaehler, and Scott Wallace, among others. Together, they help create a programming language they call ‘Smalltalk’. It’s already been a few years since the development of the C language at Bell Labs; there are already some software design standards in place. However, the invention of the Smalltalk programming language would affect virtually all these standards, and set the tone for the future of programming.

It was from this language that the Model-View-Controller pattern first emerged. Ted Kaehler is usually given credit for its development in 1978 in a paper titled ‘A note on DynaBook requirements’, though his first name for it was ‘Thing-Model-View-Set’. The aim of this MVC pattern was to bring the user ‘closer’ to the digital model that existed inside the computer program. In Kaehler’s own words, the “user was czar”, and the MVC helped mediate the way the user could interact with a software program.

If that sounds too abstract to you, don’t worry – you’ll have a firm understanding of MVC by the time we’re done.

What you should know for now is that MVC described the way a user could interact with a computer program. This would later go on to inform Graphical User Interfaces (GUIs), and thus, by proxy, pretty much all of computer science. If it wasn’t for Kaehler and his MVC pattern, you might still be typing commands into a terminal right now.

So What Exactly is a Model-View-Controller?

A Model-View-Controller is a pattern of software architecture. It controls how different applications interact with a user.

Here’s a fun fact: you’re looking at a MVC right now.

This web page is a perfect example of the MVC structure. Here, the HTML structure of this web page is the model, the CSS stylesheets that control its appearance are the ‘View’, and the browser that you use to interact with the web page is the ‘controller’.

Let’s look at this in a little more detail:

Model: The model is a representation of knowledge. That is, the model contains the actual data that has to be shown to the user. All data is held in a structured format. For example, the HTML on this web page holds the actual text that you see inside structured HTML <tags>.

View: The view is a visual representation of the model. The view informs the way data structured in the model will be made visible to the user. For example, the HTML may hold the text, but the colors, font size and font style information is actually held by independent CSS stylesheets – i.e. the view.

Controller: A controller is the environment that bridges the divide between the user and the system. This is the device that lets the user interact with the system. In the above examples, the browser is the controller that helps you interact with the web page.

One way of representing this is as follows:

Here’s a crude analogy: the muscles, bones and organs in your body are the ‘model’ that holds everything vital. The skin, hair, etc. are the ‘view’ that controls the outward representation of the muscles and bones (the model). Your senses are the ‘controller’ that helps the ‘model’ interact with the world.

Want to make web applications? Learn dynamic web programming with PHP in this course.

MVC in PHP

As a programmer, you’ll most likely to encounter MVC in a Ruby on Rails or Django project. However, it is also used in some PHP web frameworks, though the implementation isn’t nearly always uniform or in strict accordance with the theoretical foundation of MVC as laid down by Ted Kaehler.

CakePHP, which is one of the most popular PHP frameworks, uses an interpretation of the Ruby on Rails MVC pattern. If you download a copy of the framework, you’ll see the following directory structure in /app/:

Here, the model, view and controller are included in separate folders. This is what /view/ contains:

/Model/:

And /Controller/:

Here’s the MVC in CodeIgniter, another very popular PHP framework:

You can learn more about using Codeigniter in this course.

However, CakePHP and CodeIgniter’s approach isn’t pure MVC, for here, the view and the model can interact with each other. In a pure MVC, all interactions must be handled by the controller alone. Most frameworks – CakePHP included – tend to treat the View as little more than a CSS template that controls the way the web page/app looks. The MVC approach is typically muddled in most PHP frameworks, both because of a poor translation of the Ruby on Rails and other similar frameworks. You don’t necessarily need to use MVC in your programs – WordPress isn’t MVC compliant – but it certainly will improve your application design.

MVC is an abstract, theoretical topic that can be difficult to grasp for beginners. You can learn more about it in this course on PHP programming from scratch.