Introducción a MVC con PHP, primera parte

19 de Septiembre, 2007

Esta es la primera parte de una serie de artículos introductorios al patrón de diseño MVC. En este artículo en particular podrás encontrar algunos ejemplos básicos en PHP con programación estructurada/funcional.

¿Qué es MVC?

MVC viene de Model, View, Controller, o bien: Modelo, Vista y Controlador. Es un patrón de diseño que empecé a utilizar hace algún tiempo y la verdad es que me dió muy buenos resultados en los sistemas donde lo pude aplicar. La idea básica de éste patrón es separar nuestros sistemas en 3 capas, El Modelo, La Vista y el Controlador.

El Modelo se encarga de todo lo que tiene que ver con la persistencia de datos. Guarda y recupera la información del medio persistente que utilicemos, ya sea una base de datos, ficheros de texto, XML, etc.

La Vista presenta la información obtenida con el modelo de manera que el usuario la pueda visualizar.

El Controlador, dependiendo de la acción solicitada por el usuario, es el que pide al modelo la información necesaria e invoca a la plantilla(de la vista) que corresponda para que la información sea presentada.

Un pequeño ejemplo

  1. Marcos entra a nuestro sitio mediante la URL www.example.com/items/listar.
  2. Se carga el Controlador Items para ejecutar la acción de Listar.
  3. El controlador solicita al modelo que le entregue un arreglo con todos los items que hay almacenados en la base de datos.
  4. Una vez que posee dicha información le indica a la vista que va a utilizar la plantilla correspondiente al listado de items y le provee el arreglo con todos los usuarios.
  5. La vista, por su parte, toma el arreglo de items y los muestra uno a uno en la plantilla que le indico el controlador.
  6. Finalmente Marcos recibe el listado de items; lo observa un instante y decide que quiere agregar un nuevo item por lo que hace click en un enlace que lo lleva a la URL www.example.com/items/agregar.
  7. Se repite el proceso desde el paso 1 pero con la nueva URL

Vamos al codigo

Para ir de a poco tomaré un ejemplo sencillo similar a los que utilice cuando hable de PHP Data Objects y lo iré separando en capas paso a paso. El ejemplo que voy a utilizar es el siguiente:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

< ?php
require 'conexion.php';
$db = new PDO('mysql:host=' . $servidor . ';dbname=' . $bd, $usuario, $contrasenia);
$consulta = $db->prepare('SELECT * FROM items WHERE id_item = ? OR id_item = ?');
$consulta->execute(array(2, 4));
$items = $consulta->fetchAll();
$db = null;
?>
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>PDO - Jourmoly</title>
</head>
<body>
<table>
	<tr>
		<th>ID
		</th><th>Item
	</th></tr>
	< ?php
	foreach($items as $item)
	{
	?>
	<tr>
		<td>< ?php echo $item['id_item']?></td>
		<td>< ?php echo $item['item']?></td>
	</tr>
	< ?php
	}
	?>
</table>
<a href="index.php">Men&uacute;</a>
</body>
</html>

Ver Ejemplo

Nada del otro mundo, es un simple listado común presentado en una tabla HTML. Separaremos dicho ejemplo, por el momento, en 3 ficheros. Uno corresponderá al modelo, otro a la vista y el tercero será el controlador.

¿Cual es el modelo en este ejemplo?
Como mencione mas arriba, el modelo es el que se ocupa, básicamente, de todo lo que tiene que ver con el acceso a la información. Sin dudarlo, en este ejemplo PDO es quien cumple el papel de Modelo.

modelo.php

1
2
3
4
5
6

< ?php
$db = new PDO('mysql:host=' . $servidor . ';dbname=' . $bd, $usuario, $contrasenia);
$consulta = $db->prepare('SELECT * FROM items');
$consulta->execute();
$items = $consulta->fetchAll();
?>

¿Y cual es la vista?
La vista es quien representa la información para que el usuario la pueda entender, en este caso, el HTML, la tabla y todo lo usado para mostrar la información forma parte de la vista.

vista.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>PDO - Jourmoly</title>
</head>
<body>
<table>
	<tr>
		<th>ID
		</th><th>Item
	</th></tr>
	< ?php
	foreach($items as $item)
	{
	?>
	<tr>
		<td>< ?php echo $item['id_item']?></td>
		<td>< ?php echo $item['item']?></td>
	</tr>
	< ?php
	}
	?>
</table>
</body>
</html>

¿Y el controlador?
El controlador es el que permite que todo funcione.

controlador.php

1
2
3
4
5
6
7
8
9

< ?php
//Se incluye el modelo
require 'modelo.php';
 
//En $items tenemos un arreglo con todos los items gracias al modelo
 
//Ahora la vista recibe dicho arreglo para mostrarlo por pantalla
require 'vista.php';
?>

Por último, tendremos un fichero mas index.php que lo único que hará es incluir algunas variables de configuración y nuestro controlador. Es decir, para ver el resultado del script entraremos por index.php

Ver ejemplo

Afinando nuestro ejemplo

El ejemplo anterior esta bien para un primer acercamiento, pero cuando trabajamos a diario las cosas no son tan sencillas como en este caso, una sola sección o elemento(items), una sola acción(listar), etc. Lo mas normal es que necesitemos de varios controladores y que cada controlador tenga varias acciones. A su vez, cada controlador puede utilizar uno o mas modelos como así también plantillas. Para lograr todo esto, es necesario que automaticemos un poco el primer ejemplo para que admita, en principio, varios controladores y acciones.

Como primera medida vamos a crear una estructura de ficheros para que que todo quede mas o menos ordenado, sencillo:

controladores/
.....itemsControlador.php
modelos/
.....itemsModelo.php
vistas/
.....listar.php
index.php

Donde listar.php equivale a vista.php de nuestro primer ejemplo. itemsModelo.php equivale a modelo.php con algunos cambios:

itemsModelo.php

1
2
3
4
5
6
7
8
9
10
11

< ?php
global $servidor, $bd, $usuario, $contrasenia;
$db = new PDO('mysql:host=' . $servidor . ';dbname=' . $bd, $usuario, $contrasenia);
 
function buscarTodosLosItems($db)
{
	$consulta = $db->prepare('SELECT * FROM items');
	$consulta->execute();
	return $consulta->fetchAll();
}
?>

e itemsControlador.php equivale a controlador.php también con algunos cambios:

itemsControlador.php

1
2
3
4
5
6
7
8
9
10
11
12
13

< ?php
function listar()
{
	//Incluye el modelo que corresponde
	require 'modelos/itemsModelo.php';
 
	//Le pide al modelo todos los items
	$items = buscarTodosLosItems($db);
 
	//Pasa a la vista toda la información que se desea representar
	require 'vistas/listar.php';
}
?>

Como verán los únicos cambios han sido armar los scripts con funciones, de modo que cada fichero pueda tener mas de una de ellas y puedan ser llamadas en cualquier momento e independientemente.

De ahora en mas, nuestro fichero index.php será quien se encargue de averiguar cual es el controlador y acción que busca el usuario, incluirá los archivos que sean necesarios y ejecutara la acción solicitada. Todos los accesos a nuestro sistema serán por medio de index.php y las URL serán similares a las siguientes:

www.example.com/index.php?controlador=items&accion=listar
www.example.com/index.php?controlador=items&accion=agregar
www.example.com/index.php?controlador=items&accion=eliminar

www.example.com/index.php?controlador=usuarios&accion=listar

Ahora solo nos queda hacer un pequeño script que interprete nuestra URL y llame al controlador y la acción que corresponda.

index.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

< ?php
//Primero algunas variables de configuracion
require 'conexion.php';
 
//La carpeta donde buscaremos los controladores
$carpetaControladores = "controladores/";
 
//Si no se indica un controlador, este es el controlador que se usará
$controladorPredefinido = "items";
 
//Si no se indica una accion, esta accion es la que se usará
$accionPredefinida = "listar";
 
if(! empty($_GET['controlador']))
      $controlador = $_GET['controlador'];
else
      $controlador = $controladorPredefinido;
 
if(! empty($_GET['accion']))
      $accion = $_GET['accion'];
else
      $accion = $accionPredefinida;
 
//Ya tenemos el controlador y la accion
 
//Formamos el nombre del fichero que contiene nuestro controlador
$controlador = $carpetaControladores . $controlador . 'Controlador.php';
 
//Incluimos el controlador o detenemos todo si no existe
if(is_file($controlador))
      require_once $controlador;
else
      die('El controlador no existe - 404 not found');
 
//Llamamos la accion o detenemos todo si no existe
if(is_callable($accion))
      $accion();
else
      die('La accion no existe - 404 not found');
?>

Y ya lo podemos probar:

index.php?controlador=items&accion=listar

¿Y si ahora quiero insertar items?

Es muy sencillo, solo debemos agregar la accion de agregar a nuestro controlador.

itemsControlador.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

function listar()
{
	//Incluye el modelo que corresponde
	require 'modelos/itemsModelo.php';
 
	//Le pide al modelo todos los items
	$items = buscarTodosLosItems($db);
 
	//Pasa a la vista toda la información que se desea representar
	require 'vistas/listar.php';
}
 
function agregar()
{
       echo 'Aqui incluiremos nuestro formulario para insertar items';
 
       require 'modelos/itemsModelo.php';
 
       if($_POST)
       {
              insertar();
       }
 
	require 'vistas/agregar.php';
}

Desde luego que el modelo ahora también debería incluir una función insertar() y debería existir una plantilla agregar.php. Para ver nuestro formulario solo deberiamos ingresar por:

index.php?controlador=items&accion=agregar

No olvides que el action del formulario debe apuntar a www.tusitio.com/index.php?controlador=items&accion=agregar

¿Y si quiero agregar un listado de usuarios?

Para ello, solo debes crear un controlador usuariosControlador.php con una funcion listar() similar a la de itemsControlador, y obviamente, también debes crear las plantillas que creas necesarias o, por que no, reutilizar alguna que ya tengas.

index.php?controlador=usuarios&accion=listar

Notas finales

Y hasta aquí llega esta primera parte. Logramos implementar un script separado en 3 capas y dimos el primer paso con MVC usando programación estructurada/funcional. En el articulo que sigue mostraré esto mismo pero con programación orientada a objetos y algunas funcionalidades extras como aplicar URL amigables a un sistema de este tipo.

Bajar los ejemplos

Si querés retocar un poco el código, practicar, etc… podés bajarte todos los ejemplos desde aqui. Incluye un fichero .sql para que crees la tabla utilizada.

Lectura complementaria

Si mi explicación no te basto, podés leer la explicación de MVC en la wikipedia. Desde luego, Google también sabe algo sobre el tema.

Antencion:

Segunda parte

Articulos Relacionados
Suscríbete para seguir el blog Comparte este artículo
Escrito por Federico Archivado en PHP

25 comentarios en “Introducción a MVC con PHP, primera parte”

  1. ImZyos! Dijo:
    Septiembre 19, 2007 a las 2:19 am

    De buenas a primeras no coincido con tu forma de aplicarlo, aunque aun hoy nadie sabe exactamente como implementarlo, a mi gusto el mejor es mediante una clase que haga a modo de router para direccionar el controlador, de igual forma, buen articulo para lso que inician en este patron de desarrollo

  2. Federico Dijo:
    Septiembre 19, 2007 a las 10:17 am

    ImZyos, gracias por tu comentario. A decir verdad no aplico mvc a mis sistemas de la forma en la que ejemplifique en este articulo. Y coincido con la clase Router, es justamente lo que utilizo aunque no queria complicar las cosas en este primer articulo y me parecio mas sencillo mostrarlo de forma estructurada, sin clases y con ejemplos simples y faciles de entender por todos, incluso por ese gran porcentaje de programadores que utilizan PHP de manera estructurada.

    Saludos!

  3. Arcadio Dijo:
    Septiembre 19, 2007 a las 10:54 am

    He programado un monton en PHP pero estructuradamente, y este tipo de ejemplos hacen cambiar radicalmente la mentalidad de como utilizar un MVC, para un ejemplo inicial es perfecto, ya que conceptos de que hace y como es, los tengo, ejemplos claros y concisos no. Aqui en mi trabajo programamos mucho en php, y pocos aqui utilizan este tipo de programacion MVC y en lo que he visto en proyectos realizados aqui, es la mejor forma de hacerlo ya que de manera rapida y directa uno com programador puede cambiar cosas que el usuario solicite. Excelente ejemplo. Saludos desde Panamá.

  4. Federico Dijo:
    Septiembre 19, 2007 a las 11:03 pm

    Gracias por tu comentario Arcadio :)

    Voy a ver si en los próximos días escribo la segunda parte del articulo. Este es uno de los que mas tiempo me llevo(aunque no es muy largo) solo por el hecho de que lo lei y re-lei muchas veces para intentar hacerlo lo mas claro posible… intentando que se parezca a ese articulo que yo busque cuando quise aprender a usar MVC sin tener la mas mínima idea de que era.

    Saludos, nuevamente, gracias por sus comentarios.

  5. pako Dijo:
    Diciembre 1, 2007 a las 1:40 am

    yo para llamar las vistas ago esto:
    $this->load->view(MiVista); dentro de mi controlador yo utilizo el CodeIgniter para ello, pero me ayudo a entender como funciona todo esto gracias

  6. pvd Dijo:
    Diciembre 31, 2007 a las 2:53 pm

    Y la segunda parte cuando???????

  7. kmil0 Dijo:
    Enero 3, 2008 a las 4:08 am

    Vaya, muchas gracias por el articulo, una forma facil de entender, apenas para empezar, no como otros articulos que son demasiado complejos, pero este apenas es para comenzar como vos decis, ya que se podria ahorrar mucho codigo y la seguridad con algo de POO.

    es por eso que sigo esperando la II parte :)

    gracias por el tiempo ;)

  8. Federico Dijo:
    Enero 3, 2008 a las 7:04 am

    pvd, kmilo… gracias por sus comentarios.

    Tuve/tengo unos meses un poco complicados por el trabajo y ademas llegan las vacaciones, de todos modos ya falta menos para que me ponga al día y le preste un poco mas de atención a mi blog :D

    Saludos y gracias por pasar

  9. pdv Dijo:
    Febrero 12, 2008 a las 12:47 pm

    Y la segunda parte cuando??????????

    Habra segunda parte???

  10. Ofac Dijo:
    Febrero 12, 2008 a las 1:29 pm

    SEGUNDA PARTE???????

  11. Federico Dijo:
    Febrero 13, 2008 a las 8:49 am

    Será una de las primeras cosas que haga cuando tenga la pc nueva jeje :D

    Saludos

  12. netbase Dijo:
    Febrero 25, 2008 a las 11:31 am

    Se espera ansiosamente la segunda parte.. saludos

  13. Federico Dijo:
    Marzo 1, 2008 a las 5:42 pm

    Finalmente llego:

    Introducción a MVC con PHP, segunda parte

  14. Dennis Dijo:
    Marzo 15, 2008 a las 11:47 am

    Agradezco tu iluminación con respecto al modelo MVC, ya que estaba algo perdido en webs inglesas, pero este ejemplo para PHP 4 me ha dejado muy claro…

    La segunda parte ya la he leído, pero definitivamente este es más simple de digerir ;)

  15. Federico Dijo:
    Marzo 15, 2008 a las 1:42 pm

    Te agradezco el comentario Dennis :-D, y si, la segunda parte tiene unas vueltas mas, pero con tiempo, paciencia y jugando un poquito se comprende, te lo aseguro ;-)

    Saludos

  16. Eileen Dijo:
    Junio 20, 2008 a las 4:14 pm

    Felicitaciones! muy bueno el artículo, está muy bien explicado el concepto de MVC… justo lo que necesitaba…

    GRACIAS!!!!

  17. John Carlos Arrieta Arrieta Dijo:
    Julio 9, 2008 a las 4:22 am

    Hola Federico, un saludo desde Cartagena Colombia..

    Excelente trabajo te felicito…

    Desde hace un tiempo he tendido la necesidad de escribir un artículo similar, pero el tiempo y la ocupación nunca me lo ha permitido, la idea inicial era poder ofrecer otra alternativa de aprendizaje a mis estudiantes de ingeniería, aparte de los libros, de los ejercicios en el laboratorio y las clases de tablero, pero antes de iniciar con la escritura, decidí indagar un poco en google para ver si encontraba sitios especialmente blogs que están muy de moda sobre el patrón de diseño MVC con PHP, que se desprendieran en lo posible de los Framework (ZEND, Kate, Synphonia, Kumbia, etc..), que abstraen totalmente al programador sobre su implementación del MVC permitiéndoles utilizar algo que en realidad no saben para que sirve ni las múltiples ventajas que les ofrece, en mi búsqueda encontré mucho sitios interesantes y bastantes buenos, pero definitivamente mi opinión es que tus artículos I y el II son los mejor que he leído en español en la Web, debido a que cumplen con todas mis expectativas y es justamente lo que yo iba ha realizar, pero gracias a ti ya no tendré que hacerlo, así que tuve una mejor idea y le he pasado este link a todos mis estudiantes para que se ilustren mejor….
    Nuevamente Gracias…

  18. Federico Dijo:
    Julio 10, 2008 a las 8:21 pm

    Eileen, John Carlos. ¡¡¡muchísimas gracias por sus comentarios!!! :-D

    Me alegra mucho saber que mis artículos les sean de utilidad.

    Saludos

  19. jacs Dijo:
    Agosto 8, 2008 a las 12:46 am

    Interesante articulo, llevo un año y medio programando comercialmente y hasta hace 4 meses fue que inicie en el mundo de la POO, y eso me ha llevado tambien a incursionar en el patron MVC, me parece un buen articulo para iniciar, y posteriormente canalizar el MVC hasta la POO

  20. ivan Dijo:
    Agosto 29, 2008 a las 11:48 am

    10 puntos, clarisima la forma de explicar el tema y con un ejemplo simple y abarcativo, de mucha utilidad para gente que recien se inicia en el mundo de MVC

    un saludo

  21. nucklear Dijo:
    Agosto 30, 2008 a las 10:44 pm

    $consulta->execute(array(2, 4));

    Exactamente aca que es lo que hace el array… ?

  22. Federico Dijo:
    Agosto 31, 2008 a las 12:34 pm

    Hola nuklear:

    $consulta = $db->prepare(’SELECT * FROM items WHERE id_item = ? OR id_item = ?’);
    $consulta->execute(array(2, 4));

    El array contiene los parametros que se deben pegar en la consulta SQL, es decir que la consulta queda asi:

    SELECT * FROM items WHERE id_item = 2 OR id_item = 4

    Son consultas parametrizadas.

    @Jacs, @ivan: gracias por sus comentarios :-D

  23. nucklear Dijo:
    Septiembre 9, 2008 a las 11:36 am

    ah ya entendi, despues de darle muchas vueltas jeje.
    se podria tener una consulta preparada asi $consulta = $db->prepare(’SELECT * FROM items WHERE id_item = ? OR id_item = ? OR id_item = ?’);
    y luego :
    $consulta->execute(array(2, 4, 6));

    Esto nos daria como respuesta todos los items que tengan por id_item esos tres valores, es asi o estoy diciendo cualquier burrada.
    Saludo y gracias por todo.

  24. Federico Dijo:
    Septiembre 9, 2008 a las 11:40 am

    Exacto ;-)

  25. kelcarco Dijo:
    Septiembre 26, 2008 a las 9:59 am

    Muy Interesente el articulo, me sirvio muchisimo ahora a fusionar esto con POO eso es lo mas interesante.. nada que envidiarle a otros lenguajes privativos.. Espero siguas publicando articulos como este…muchas felicidades

Deja tu comentario

XHTML: Puedes usar estos tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>

El blog funciona con Wordpress y Simpla theme