MVC anatomy for PHP developers

This is a simplified approach of explaining the MVC = Model-View-Controller design pattern to novice programmers who struggle with what belongs where.

If a child can’t learn the way we teach, maybe we should teach the way they learn. – Ignacio Estrada

Most MVC tutorials require advanced OOP knowledge or that you are familiar with a full-stack framework. The problem with this approach is the target audience they were intended for. Explaining a design pattern to system architects is preaching to the choir.

The one you should be preaching to is the beginners, those who just picked up PHP and are looking for simple to understand answers on how to elegantly layout their code. This code will most likely be procedural, as they have no solid grasp of OOP, and will not leverage an existing framework as they don’t know their way around a full framework and won’t see the benefits of using one.

Successfull use of this presentation pattern isolates business logic from the user interface, permitting one to be freely modified without affecting the other. The controller collects user input, the model manipulates application data, and the view presents results to the user.

MVC separates the dependencies between a Model (Domain objects), your screen/web page (the View), and how your UI is supposed to behave (Presenter/Controller)

Controller is created or accessed based on some event/request, the controller then creates the appropriate View and interacts with the Model to further configure the View. It boils down to: Controller creates and manages View, View is slave to Controller. View does not know about Controller.

Benefits of using a MVC layout

• Clean separation of the different web app layers.
• Separation of concerns in the codebase.
• Allows re-use of business-logic across applications.
• Developer specialization and focus.
• Parallel development by separate teams.
• Layers can be exchanged independently.
• View/Controller decoupling – change the way a view responds to user input without changing its visual presentation.
• View/Model decoupling – Attach multiple views to a model to provide different presentations.
• Attach multiple simultaneous views of the same model.
• Syncronized views – all views simultaneously reflect the current state of the model.
• Easier to test the core of the application, as encapsulated by the model.

Flow of control in an MVC system [from Wikipedia]:

1. The user interacts with the user interface in some way (for example, presses a mouse button).
2. The controller handles the input event from the user interface, often via a registered handler or callback.
3. The controller notifies the model of the user action, possibly resulting in a change in the model’s state. (For example, the controller updates the user’s shopping cart.)
4. A view uses the model indirectly to generate an appropriate user interface (for example, the view lists the shopping cart’s contents). The view gets its own data from the model. The model and controller have no direct knowledge of the view.
5. The user interface waits for further user interactions, which restarts the cycle.

To demonstrate a simple MVC approach, imagine you want to scan a directory full of images and display them in various views, a list, a photo gallery and write everything to a CSV file.

First off the model who fetches the data (images) from a specified directory.

$path = 'images';
$files = scandir($path, 1);

Second the different views used to render the data in different formats to the browser or different output media like a CSV file.

function getNav() {
	echo '
<ul>
	<li><a href="?show=list">List</a></li>
	<li><a href="?show=gallery">Gallery</a></li>
	<li><a href="?show=csv">CSV</a></li>
</ul>
';
}
 
function getList($files) {
	echo '
<ul class="list">';
	foreach ($files as $file) {
		echo '
	<li><a href="'.$path.'/'.$file.'" target="_blank">'.$file.'</a></li>
';
	}
	echo '</ul>
';
}
 
function getGallery($files) {
	echo '
<ul class="gallery">';
	foreach ($files as $file) {
		echo '
	<li><a href="'.$path.'/'.$file.'" target="_blank"><img src="'.$file.'" alt="" /></a></li>
';
	}
	echo '</ul>
';
}
 
function writeCsv($files) {
	$fp = fopen('file.csv', 'w');
	foreach ($files as $file) {
		fputcsv($fp, split(',', $file));
	}
	fclose($fp);
}

Last but not least, the most important part, the controller which displays the navigation for an HTML output followed by the business logic for handling the requests.

getNav();
 
switch ($_GET['show']) {
	case 'list': getList($files); break;
	case 'gallery': getGallery($files); break;
	case 'csv': writeCsv($files); break;
	default: getList($files); break;
}

Tags: design patterns, mvc, php