Vistas con Blade: Potencia y Elegancia en tu Frontend

Domina el motor de plantillas que hace que escribir HTML sea un placer.

A diferencia de otros motores de plantillas, Blade no te impide usar PHP puro en tus vistas, pero está diseñado para que no tengas que hacerlo. Todas las vistas de Blade se compilan en código PHP ordinario y se almacenan en caché para un rendimiento óptimo, lo que significa que Blade añade prácticamente cero sobrecarga a tu aplicación.

1. Herencia de Plantillas: El concepto de Layouts

La mayoría de las aplicaciones web mantienen un diseño común (cabecera, pie de página, menús). En lugar de repetir este código en cada archivo, creamos un Layout maestro.

El archivo base (`resources/views/layouts/app.blade.php`)

Usamos la directiva @yield para marcar las secciones que cambiarán en cada página:

<!DOCTYPE html>
<html lang="es">
<head>
    <title>Mi App - @yield('title')</title>
</head>
<body>
    <nav> </nav>

    <main class="container">
        @yield('content')
    </main>

    <footer> Pie de página </footer>
</body>
</html>

Extendiendo el Layout (`resources/views/home.blade.php`)

Para usar ese diseño, "extendemos" el archivo y rellenamos las secciones:

@extends('layouts.app')

@section('title', 'Página de Inicio')

@section('content')
    <h1>Bienvenido a mi web</h1>
    <p>Este contenido se inyecta en el layout principal.</p>
@endsection

2. Directivas de Control: Lógica sin etiquetas PHP

Blade sustituye las pesadas etiquetas <?php if(...): ?> por directivas cortas y legibles.

Condicionales (@if)

@if(count($records) === 1)
    Hay un registro.
@elseif(count($records) > 1)
    Hay muchos registros.
@else
    No hay registros.
@endif

{{-- Directiva útil para usuarios autenticados --}}
@auth
    <p>Hola, {{ auth()->user()->name }}</p>
@endauth

Bucles (@foreach)

Blade hace que iterar sobre datos sea extremadamente sencillo, e incluye una variable mágica $loop para conocer el estado del bucle.

<ul>
@foreach($users as $user)
    <li class="{{ $loop->first ? 'font-bold' : '' }}">
        {{ $user->name }} (Iteración: {{ $loop->iteration }})
    </li>
@endforeach
</ul>

3. Fragmentos de Vista: `@include` y Componentes

Si tienes un elemento que se repite mucho pero no es un layout entero (como una tarjeta de producto o un botón), puedes usar fragmentos.

Uso de @include:

{{-- Pasamos variables al fragmento --}}
@include('partials.alert', ['type' => 'danger', 'message' => 'Error al guardar'])

4. Mostrar Datos y Seguridad (XSS)

Por defecto, Blade te protege de ataques XSS (Cross-Site Scripting). Cuando usas las llaves dobles {{ $variable }}, Laravel escapa automáticamente el contenido HTML.

{{-- Esto es seguro: imprimirá el texto tal cual --}}
{{ "<script>alert('hack')</script>" }}

{{-- Esto imprimirá el HTML sin escapar (¡Úsalo con cuidado!) --}}
{!! $contenido_html_confiable !!}

Tip de Experto: Blade también permite crear Componentes de Clase. Son ideales cuando un fragmento de vista necesita su propia lógica de PHP antes de renderizarse, manteniendo tus controladores aún más limpios.