Home

52. Vistas en PHP

En este capítulo vamos a trabajar con las vistas que se van a mostrar, para ello vamos a crear una carpeta denominada resources, y dentro de ella vamos a crear una carpeta denominada views que es en la que vamos a trabajar en este capítulo.

Esquema hasta ahora

Hasta ahora el esquema de nuestra app es el siguiente:

  • app
    • Controllers
      • Controller.php 
      • HomeController.php
    • Models
  • lib
    • Route.php
  • public
    • css
    • img
    • js
    • .htaccess
    • index.php
  • resources
    • css
    • js
    • views
      • home.php
  • routes
    • web.php
  • .htaccess
  • autoload.php

Por qué crear la carpeta resources

En esta carpeta, además de crear las vistas, vamos a incluir código css y también código JavaScript. La diferencia entre los archivos css y JavaScript que coloquemos aquí con respecto a los de la carpeta public es que el código de la carpeta resources es código que en teoría deberíamos compilar por ejm con preprocesadores como Sass, Webpack... Una vez se compile, esa compilación colocarla en la carpeta public para poder acceder a dichos archivos. Aún no sabemos si vamos a compilar algún código, pero de paso lo dejamos preparado.

Vistas

Las vistas se van a tratar de un documento PHP que va a mostrar HTML. Por ejm vamos a crear un vista denominada home.php que lo que queremos que nos retorne es un documento HTML.

Paso de parámetros a nuestra vista

Ahora vamos a ver como pasar parámetros a nuestra vista y poder imprimirlos. Para ello vamos a ir al archivo Controllers/HomeController.php y haremos las modificaciones oportunas.

Estos son los archivos que hemos modificado en este capítulo.

HomeController.php

<?php

namespace App\Controllers;

class HomeController extends Controller {
  public function index(){
    // Método que se encarga de incluir toda la lógica necesaria para mostrar contenido
    return $this->view('home', [
      'title' => 'Home',
      'description' => 'Esta es la página Home'
    ]);
  }
}

 

Controller.php

<?php

namespace App\Controllers;

class Controller {
  public function view($route, $data = []){

    // Destructurar el Array
    extract($data);

    $route = str_replace('.', '/', $route);

    if(file_exists("../resources/views/{$route}.php")){
      ob_start();
      return include "../resources/views/{$route}.php";
      $content = ob_get_clean();

      return $content;
    } else {
      return "El archivo no existe";
    }
  }
}

 

home.php

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <h1>Hola desde la página Home</h1>

  <p>Título: <?= $title ?></p>
  <p>Descripción: <?= $description ?></p>
</body>
</html>