
Para utilizar Blade, y suponiendo que estamos trabajando con la estructura de directorios que se propuso en el apartado anterior, simplemente tienes que añadir a tus páginas del directorio "public
" lo siguiente:
<?php require 'vendor/autoload.php'; use Philo\Blade\Blade; $views = '../views'; $cache = '../cache'; $blade = new Blade($views, $cache); echo $blade->view()->make('vista')->render();
Esto me cargaría la vista "vista.blade.php
" de la carpeta "views
". Fíjate que solo hace falta poner el nombre de la vista y no la extensión ".blade.php
".
Para entender esto mejor desarrollaremos un proyecto con dos páginas, una para ver el listado de productos de la base de datos proyecto y otra para ver el listado de familias.
A las clases Conexion, Productos y Familias que ya la hemos visto a lo largo del tema, vamos a modificarlas para usar namespaces
en todo el proyecto. La estructura de nuestro proyecto de ejemplo podría ser la siguiente:

- En "
src
" tendremos las clases para conectarnos a la base de dato y recuperar los datos de familias y productos. - En "
public
" Las dos páginas que realmente mostraremos - En "
views
" crearemos una carpeta "plantillas
" (pondremos las plantillas que reusaremos las veces que queramos) y las dos vistas, la que me generará el listado de productos y la que me generará el listado de familias.
Vamos a ello:
Las clases ya sabemos como hacerlas simplemente vamos a poner en el encabezado de las mismas, lo siguiente. Ten en cuenta que el nombre del namespace viene dado por lo que pusimos en el "
autoload
" del composer
y la carpeta de las mismas también. Si los has cambiado debes reflejarlo en "composer.json
"
<?php
namespace Clases;
use PDO;
use PDOException;
Al usar namespace es necesario poner "use
" a los métodos y la clase PDO.
Si no lo hacemos para no tener errores tendríamos que andar poniendo "$conexion = new \PDO(. . . )
, catch(\PDOException)
. . ."
Las páginas que vamos a ver (familias y productos) comporten una estructura como el esqueleto html, la carga de bootstrap o las hojas de estilos, todo esto lo podemos meter en la plantilla y así nos evitamos tener que repetir el mismo código una y otra vez. Veamos la plantilla
<!doctype html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!-- css para usar Bootstrap -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<title>@yield('titulo')</title>
</head>
<body style="background:#0277bd">
<div class="container mt-3">
<h3 class="text-center mt-3 mb-3">@yield('encabezado')</h3>
@yield('contenido')
</div>
</body>
</html>
cada instrucción de Blade viene precedida de "@
". En las líneas 10, 14 y 15 verás "@yield('. . .')
" se usa para mostrar el contenido de una sección determinada. Para cada página cambiaremos: contenido, título y cabecera.
Veamos como hacemos uso de esta plantilla en las vistas:
Vista: "vistaProductos.blade.php
"
@extends('plantillas.plantilla1')
@section('titulo')
{{$titulo}}
@endsection
@section('encabezado')
{{$encabezado}}
@endsection
@section('contenido')
<table class="table table-striped">
<thead>
<tr class="text-center">
<th scope="col">Código</th>
<th scope="col">Nombre</th>
<th scope="col">Nombre Corto</th>
<th scope="col">Precio</th>
</tr>
</thead>
<tbody>
@foreach($productos as $item)
<tr class="text-center">
<th scope="row">{{$item->id}}</th>
<td>{{$item->nombre}}</td>
<td>{{$item->nombre_corto}}</td>
@if($item->pvp>100)
<td class='text-danger'>{{$item->pvp}}</td>
@else
<td class='text-success'>{{$item->pvp}}</td>
@endif
</tr>
@endforeach
</tbody>
</table>
@endsection
Vista "vistaFamilias.blade.php
"
@extends('plantillas.plantilla1')
@section('titulo')
{{$titulo}}
@endsection
@section('encabezado')
{{$encabezado}}
@endsection
@section('contenido')
<table class="table table-striped">
<thead>
<tr class="text-center">
<th scope="col">Código</th>
<th scope="col">Nombre</th>
</tr>
</thead>
<tbody>
@foreach($familias as $item)
<tr class="text-center">
<th scope="row">{{$item->cod}}</th>
<td>{{$item->nombre}}</td>
</tr>
@endforeach
</tbody>
</table>
@endsection
Lo primero que hacemos con "@extends('...')
" es llamar a la plantilla, para ello indicamos la ruta (fíjate que la extensión ".blade.php
" no hace falta ponerla). Acuérdate que creamos tres "yields
" uno llamado título, otro encabezado y otro contenido, para rellenarlos ponemos el bloque "@section('...'), @endsection
" con el nombre que pusimos en los "yields
".
A las vistas mandamos unas variables (en el apartado siguiente veremos como). A la vista "vistaProductos.blade.php
" mandamos las variables "$titulo, $encabezado y $productos
", $producto
trae los productos de las base de datos (los mandamos con un "fetchAll()
" de una consulta a la tabla productos). Cuando usamos Blade no hace falta poner "<?php echo $titulo; ?>
" que es como lo hemos hecho hasta ahora, nos basta con poner "{{...}}
"
Puedes observar ademas que también podemos poner un bucle para recorrer, en este caso, los productos "@foreach(...), endforeach
".
De igual manera con un bloque "@if, @else, @endif
" pintamos los precios de mas de 100€ de rojo y el resto de verde.
El código HTML lo ponemos tal cual, si necesitásemos poner código PHP en una pagina Blade lo pondríamos entre las directivas "@php, @endphp
"
En el enlace siguiente tenemos un manual muy completo de Blade en "styde.net"