14-Aplicando el Patrón MVC en PHP - Parte 2: Modularización y Variables GET

 

Aplicando el Patrón MVC en PHP - Parte 2: Modularización y Variables GET

En la primera parte de este tutorial, aprendimos a configurar la estructura básica de nuestro proyecto bajo el patrón Modelo-Vista-Controlador (MVC) y logramos que el index.php invocara un controlador, que a su vez cargaba una vista (inicio.php). Esto ya nos da una gran ventaja: el usuario solo interactúa con el index.php, mientras que el controlador y las vistas permanecen en carpetas protegidas, fuera de su alcance directo.

Sin embargo, nuestra página aún es muy estática. En esta segunda parte, vamos a dar un paso crucial para hacerla dinámica. Aprenderemos a:

  1. Modularizar los componentes de nuestra plantilla (como el menú de navegación) para un código más limpio y mantenible.

  2. Utilizar variables GET en los enlaces para indicar qué contenido debe mostrarse.

  3. Hacer que nuestro controlador interprete esas variables y decida qué vista (módulo) cargar en la sección principal de la página.

Nuestra Meta

Construiremos un sitio web simple pero funcional con una barra de navegación (Inicio, Nosotros, Servicios, Contáctenos) y un área de contenido que cambiará dinámicamente según el botón en el que el usuario haga clic, todo esto gestionado por nuestro patrón MVC.

Paso 1: Preparando la Plantilla Base (template.php)

Nuestra plantilla será el esqueleto de todas las páginas. Tendrá un <header>, un lugar para el menú y una sección <section> donde irá el contenido cambiante.

Primero, añadamos una hoja de estilos básica para darle algo de forma a nuestra página. Puedes copiar este código dentro de la etiqueta <head> de tu archivo template.php.

php
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <title>Mi Sitio MVC</title>
    <style>
        body { font-family: sans-serif; margin: 0; padding: 0; }
        header { background: #333; color: white; padding: 1em; text-align: center; }
        nav { background: #444; padding: 1em; }
        nav ul { list-style: none; margin: 0; padding: 0; text-align: center; }
        nav ul li { display: inline; margin: 0 15px; }
        nav ul li a { color: white; text-decoration: none; }
        section { padding: 2em; min-height: 300px; }
    </style>
</head>
<body>
    <header>
        <h1>LOGOTIPO</h1>
    </header>

    <!-- Aquí irá nuestra navegación -->
    <?php
    // Incluimos el módulo de navegación
    include "modules/navegacion.php";
    ?>

    <section>
        <!-- Aquí irá el contenido dinámico -->
    </section>

</body>
</html>

Fíjate en la línea <?php include "modules/navegacion.php"; ?>. En lugar de tener el código HTML del menú directamente aquí, lo estamos "invitando" desde otro archivo. Esto es modularizar.

Paso 2: Creando los Módulos

Ahora crearemos los archivos que contendrán las partes reutilizables de nuestra página. Dentro de la carpeta /views, crea una subcarpeta llamada modules.

2.1. El Módulo de Navegación (modules/navegacion.php)

Crea el archivo navegacion.php dentro de /views/modules/. Aquí pondremos el código de nuestro menú. Pero no será un menú cualquiera; sus enlaces incluirán una variable especial para comunicarse con el controlador.

php
<nav>
    <ul>
        <li><a href="index.php?action=inicio">Inicio</a></li>
        <li><a href="index.php?action=nosotros">Nosotros</a></li>
        <li><a href="index.php?action=servicios">Servicios</a></li>
        <li><a href="index.php?action=contactenos">Contáctenos</a></li>
    </ul>
</nav>

Observa la estructura de los enlaces: index.php?action=inicio.

  • index.php: Siempre apuntamos a nuestro archivo frontal, el único punto de entrada.

  • ?: Este signo indica que comenzaremos a pasar parámetros a través de la URL.

  • action: Es el nombre de la variable GET que estamos creando. Podríamos llamarla p, page, seccion, etc. action es un nombre descriptivo.

  • =inicio: Es el valor que le asignamos a la variable action.

Cuando un usuario haga clic en "Nosotros", el navegador llamará a index.php?action=nosotros. Es decir, le enviará a index.php un dato: action con valor nosotros. Nuestro trabajo será capturar y usar ese dato.

2.2. Los Módulos de Contenido

Ahora crearemos un archivo por cada sección de nuestra página. Todos irán en la misma carpeta /views/modules/.

  • inicio.php:

    php
    <h1>PÁGINA DE INICIO</h1>
<p>Bienvenido a nuestro sitio web.</p>

  • nosotros.php:

    php
    <h1>PÁGINA DE NOSOTROS</h1>
<p>Conoce más sobre nuestra historia y equipo.</p>

  • servicios.php:

    php
    <h1>PÁGINA DE SERVICIOS</h1>
<p>Estos son los servicios que ofrecemos.</p>

  • contactenos.php:

    php
    <h1>PÁGINA DE CONTÁCTENOS</h1>
<p>Ponte en contacto con nosotros.</p>

Ahora tenemos la navegación y cada posible contenido listo en archivos separados. Es mucho más fácil de mantener, ¿verdad? Si queremos cambiar el texto de "Servicios", solo editamos un archivo.

Paso 3: El Controlador Toma el Control (controller.php)

Nuestro controlador ya no puede limitarse a carar una sola vista. Ahora debe analizar la petición del usuario (¿qué valor trae la variable action?) y, en base a eso, decidir qué módulo de contenido incluir dentro de la plantilla.

Modifica tu archivo controller.php (que se encuentra en la carpeta /controllers) de la siguiente manera:

php
<?php
// controllers/controller.php

class MVCController {

    public function cargarPlantilla() {
        include "views/template.php";
    }

    public function enlazarPagina() {
        // 1. Verificar si la variable 'action' existe en la URL
        if (isset($_GET['action'])) {
            // 2. Guardar el valor de 'action' en una variable
            $enlace = $_GET['action'];
        } else {
            // 3. Si no existe 'action', cargamos la página de inicio por defecto
            $enlace = "inicio";
        }

        // 4. Aquí irá la lógica para incluir el módulo correcto
        //    (La implementaremos en el siguiente paso)
    }
}
?>

Analicemos el código:

  • isset($_GET['action']): Esta función verifica si la variable action ha sido enviada a través de la URL. $_GET es un arreglo especial de PHP que contiene todas las variables GET.

  • Si la variable existe (isset es true), guardamos su valor en $enlace.

  • Si no existe (es la primera vez que se carga la página), asignamos un valor por defecto: "inicio". Esto asegura que siempre se muestre algo.

Paso 4: Mostrando el Módulo Correcto

El controlador ya sabe qué módulo debe cargar (el valor de $enlace). Ahora necesitamos que la plantilla pueda usar esa información para incluir el archivo .php correspondiente.

Hay varias formas de hacerlo. Un método limpio y común es que el controlador guarde la ruta completa del módulo en una variable y luego la plantilla simplemente la incluya.

Actualiza tu controller.php:

php
<?php
// controllers/controller.php

class MVCController {

    public function cargarPlantilla() {
        include "views/template.php";
    }

    public function enlazarPagina() {
        if (isset($_GET['action'])) {
            $enlace = $_GET['action'];
        } else {
            $enlace = "inicio";
        }

        // Construir la ruta completa al módulo
        $rutaModulo = "views/modules/" . $enlace . ".php";

        // Verificar si el archivo existe antes de incluirlo (buena práctica)
        if (file_exists($rutaModulo)) {
            return $rutaModulo;
        } else {
            // Si no existe, podrías redirigir a una página de error 404
            return "views/modules/inicio.php"; // Por ahora, volvemos a inicio
        }
    }
}
?>

Ahora, modifica tu template.php para usar esta información:

php
<!DOCTYPE html>
... (head y estilos) ...
<body>
    <header>
        <h1>LOGOTIPO</h1>
    </header>

    <?php include "modules/navegacion.php"; ?>

    <section>
        <?php
        // Creamos una instancia del controlador
        $controlador = new MVCController();
        // Llamamos al método que nos dice qué módulo incluir
        $ruta_contenido = $controlador->enlazarPagina();
        // ¡Incluimos el módulo!
        include $ruta_contenido;
        ?>
    </section>

</body>
</html>

Paso 5: Poniéndolo Todo en Marcha con index.php

Finalmente, nuestro index.php (el archivo frontal en la raíz del proyecto) sigue siendo el mismo que en la parte 1. Su única responsabilidad es iniciar el controlador.

php
<?php
// index.php (en la raíz del proyecto)
require_once "controllers/controller.php";

$controlador = new MVCController();
$controlador->cargarPlantilla();
?>

Probando Nuestro Sitio Dinámico

  1. Abre tu navegador y ve a http://localhost/tu-ruta/index.php. Verás la página con el logotipo, el menú y, por defecto, el contenido de "PÁGINA DE INICIO".

  2. Haz clic en el enlace "Nosotros". La URL cambiará a .../index.php?action=nosotros y el contenido de la sección cambiará a "PÁGINA DE NOSOTROS".

  3. Prueba "Servicios" y "Contáctenos". ¡Cada clic muestra el contenido del módulo correspondiente sin recargar la plantilla completa!

Conclusión y Resumen

¡Felicidades! Has dado un salto gigante en la construcción de una aplicación MVC.

  • Hemos mejorado la organización: Separamos el menú y los contenidos en "módulos" reutilizables dentro de la carpeta views.

  • Introdujimos las variables GET: Los enlaces ahora envían información (action=valor) a través de la URL.

  • El controlador se volvió inteligente: Ahora es el corazón de la aplicación, que interpreta la petición del usuario ($_GET['action']), toma decisiones y le dice a la plantilla qué contenido debe mostrar.

En la siguiente parte, podríamos explorar cómo conectar esto con una base de datos (el Modelo) para que el contenido no sea texto fijo en archivos PHP, sino que provenga de una base de datos, llevando nuestro patrón MVC a su máximo potencial.

Comentarios

Publicar un comentario

Entradas más populares de este blog

token

  ¿Qué es un token? Un  token  es una cadena de caracteres que representa información específica, como credenciales de acceso, identificadores únicos o datos de sesión. Se utilizan comúnmente en: Autenticación y autorización (JWT, tokens de acceso) Protección CSRF (Cross-Site Request Forgery) Identificación única de recursos Contraseñas de un solo uso Ejemplo pequeño en PHP: Token de autenticación simple php <?php // Función para generar un token aleatorio function generarToken ( $longitud = 32 ) { return bin2hex ( random_bytes ( $longitud ) ) ; } // Generar un token $token = generarToken ( ) ; echo "Token generado: " . $token . "\n\n" ; // Simular verificación del token (en una aplicación real se guardaría en base de datos) function verificarToken ( $tokenAlmacenado , $tokenRecibido ) { return hash_equals ( $tokenAlmacenado , $tokenRecibido ) ; } // Ejemplo de uso $tokenAlmacenado = $token ; // En la práctica, esto ven...
Leer más

¿Qué es un token y cómo se utiliza en una API?

  ¿Qué es un token y cómo se utiliza en una API? ¿Qué es un token? Un  token  es una cadena de caracteres que actúa como credencial de acceso para autenticar y autorizar a un usuario o aplicación en una API. Funciona como una "llave digital" que permite acceder a recursos protegidos sin necesidad de compartir credenciales sensibles como usuario y contraseña en cada solicitud. Tipos comunes de tokens: JWT (JSON Web Token) : Token auto-contenido con información codificada Access Token : Para acceso a recursos Refresh Token : Para renovar access tokens expirados API Key : Clave simple de identificación Ejemplo con PHP usando JWT 1. Instalación de dependencias bash composer require firebase/php-jwt 2. Generar un token JWT php <?php require 'vendor/autoload.php' ; use Firebase \ JWT \ JWT ; use Firebase \ JWT \ Key ; class TokenManager { private $secretKey = "tu_clave_secreta_muy_segura" ; private $algorithm = 'HS256' ; ...
Leer más

Generación de Credenciales API

   Generación de Credenciales API Método 1: Credenciales básicas (API Key + Secret) php <?php // Generar credenciales seguras function generarCredencialesAPI ( ) { $api_key = bin2hex ( random_bytes ( 32 ) ) ; // 64 caracteres hexadecimales $api_secret = bin2hex ( random_bytes ( 64 ) ) ; // 128 caracteres hexadecimales return [ 'api_key' => $api_key , 'api_secret' => password_hash ( $api_secret , PASSWORD_DEFAULT ) ] ; } // Generar y guardar credenciales $credenciales = generarCredencialesAPI ( ) ; // Guardar en base de datos (ejemplo) // INSERT INTO api_credentials (api_key, api_secret_hash, created_at) // VALUES (:api_key, :api_secret, NOW()) ?> Método 2: Credenciales JWT php <?php use Firebase \ JWT \ JWT ; use Firebase \ JWT \ Key ; class JWTCredentials { private $secret_key ; public function __construct ( ) { $this -> secret_key = bin2hex ( r...
Leer más