Citation preview

Usuario

¿Olvidaste tu usuario o clave?

soroF

golB selai rotuT

Entrar

Contraseña

sosrs u C elai rotutoediV

o registrate

Buscar..

cm io C

l a i ro t u t nu ac i l buP ?ba l a t s i rC se éuQ¿

sgaTso l pme jE sona t cá t noC

emi nA

Buscar

¿Qué quieres buscar?

» Tutoriales / Blade, el sistema de plantillas de Laravel

Blade, el sistema de plantillas de Laravel Por Duilio el 01 de Octubre de 2013 con 4,349 visitas PHP, MySQL y Servidor Otros tutoriales por Duilio.

Like

Test de Mathématiques www.test-Math.com Découvrez votre niveau en Maths. Faites notre test de Mathématiques.

6

25 Twittear

Para cerrar esta primera parte de los tutoriales quiero mostrarles cómo funcionan las vistas en Laravel. Este es quizás el tutorial más fácil de todos. Veremos cómo usar el sistema de plantillas de Laravel llamado Blade. No te pierdas los anteriores tutoriales de Laravel: introducción a Laravel, su instalación, Cómo configurar la base de datos y crear migraciones, las rutas y los controladores.

Banoicnuf m o óc y se éQ u Blade es básicamente un sub-lenguaje muy sencillo, que antes de ser usado por nuestra aplicación, es compilado a PHP plano. Para usar Blade, simplemente creen sus plantillas en el directorio views/ con la extensión .blade.php en vez de .php. Por ejemplo: Código :

views/template.blade.php

Ahora creen una ruta o controlador que llame a la plantilla (ya saben cómo, ¿Cierto?) En caso de que no… En app/routes.php pongan esto: Código :

Route::get('template', function () { return View::make('template'); });

Ahora en views/template.blade.php escriban algo de HTML: Código :

Hello Cristalab

Bastante básico, es decir, en este punto da igual si usamos Blade o no… Pero, vamos a ver:

satsiv r ibi rcsem o ó C Ok, supongamos que, como en ejemplos anteriores, queremos usar un nombre variable:

Código :

Route::get('template/{name}', function ($name) { $name = ucwords(str_replace('-', ' ', $name)); return View::make('template')->with('name', $name); });

En este caso, para hacer el ejemplo más interesante, lo pasamos por la ruta, y luego lo asignamos a la vista, con el método ->with() que va concatenado a View::make, fíjense: Código :

View::make('template')->with('name', $name)

Ok, ahora en nuestra vista, si estuviéramos usando sólo PHP, tendríamos que escribir algo así: Código :

Hello

Pero gracias a Blade, podemos escribirlo así: Código :

Hello {{ $name }}

Básicamente: {{ }} es un sustituto de que por un lado es más corto y fácil de escribir, por otro usar etiquetas PHP () se “mezcla” con las etiquetas del HTML, así que usar motores como Blade es más “limpio” por así decirlo. Blade sólo reemplaza {{ * }} por , es decir, todo el código PHP que quieras escribir es válido dentro de {{ }}, por ejemplo:

Código :

Hello {{ strtoupper($name) }}

Otros motores de plantillas para PHP más avanzados como Smarty o Twig compiladores más poderosos, que permiten usar, por ejemplo, sintaxis de punto para los arrays, la cual no es soportada por PHP, etc.

tcur tse r ibi rcsem o ó C Por último veremos cómo se escriben estructuras de control sencillas pero muy comunes como IF y FOREACH. Blade tiene una sintaxis bien simple, por ejemplo: Código :

@if ($name == 'Walter White' OR $name == 'Jesse Pinkman') Goodbye Breaking Bad @else Hello {{ $name }} @endif

Nuevamente, todo lo que está dentro del paréntesis del IF es PHP común y corriente, lo que cambia es que en vez de escribir:

Código :

O:

Código :

Escribimos:

Código :

@if (...)

Es una sintaxis mucho más limpia y adecuada para nuestras vistas… Por supuesto, si están escribiendo los ejemplos pueden ejecutarlos en el navegador, escribiendo algo como: Código :

http://localhost/pruebalaravel/public/template/walter+white

Esto es con respecto a la sintaxis, pero Blade también nos brinda una herramienta potente para escribir vistas:

varaL ne stuoyaL ed oU s Casi todos los proyectos, por no decir todos, tienen un “layout” que consiste, por lo general en un header + un footer. Por ejemplo fíjense Cristalab.com ¿Han visitado esa página? Todas las páginas dentro del site cristalab.com llevan en la cabecera el logo de Cristalab + el menú etc. y en el pie de página tiene el menú repetido y la foto de Freddier en un pony (bueno no, pero sería más divertido). Ese HTML que se repite en cada página se llama layout y en Blade podemos escribirlo así: Creen una vista llamada:

Código :

views/layout.blade.php

Con el siguiente HTML de ejemplo:

Código :



Aprendiendo Laravel

@yield('content')

Copyright 2013 - Todos los ponies reservados.

Y luego en views/template.blade.php coloquen lo siguiente:

Código :

@extends ('layout') @section ('content') Hello {{ $name }} @stop

El PHP en nuestra ruta sigue igual, es decir, seguiremos invocando a template, no a layout: Código :

View::make(‘template’)

Pero template a su vez “extiende” la plantilla layout, como si fuera un objeto hijo que extiende de un objeto padre: Código :



@yield('title', 'Aprendiendo Laravel')

@yield('content')

Copyright 2013 - Todos los ponies reservados.

Noten que el título HTML cambió a: Código :

@yield(‘title’, ‘Aprendiendo Laravel’)

En este caso el segundo parámetro de @yield sería el valor por defecto, es decir, si abrimos en el navegador nuestra dirección: Código :

http://localhost/pruebalaravel/public/template/cristalab

Seguiremos viendo en el título del mismo la frase: Aprendiendo Laravel, que es nuestro título por defecto. Pero si cambiamos views/template.blade.php a: Código :

@extends ('layout') @section ('title') Saludos a {{ $name }} @stop @section ('content') Hello {{ $name }} @stop

Entonces el título ahora será, por ejemplo: “Saludos a Cristalab”. Tengan en cuenta que pueden crear tantas secciones como gusten, y que cada sección puede tener un valor por defecto y un valor distinto en cada sub-plantilla. Además pueden usar variables, etc. en cada sección. Para finalizar, 2 tips: 1. En HTML, como ya deben saber, los comentarios se escriben así:

Código :

Y suelen ser útiles cuando el HTML que escribimos es muy complicado, sin embargo dichos comentarios se envían al navegador junto con el resto de las etiquetas, y esto no es siempre lo que queremos, dado que cualquiera podría leerlos y hacen el HTML un poco más pesado, etc… Con Blade podemos escribir comentarios así:

Código :

{{-- Esto es un comentario --}}

Dichos comentarios no son compilados como HTML ni enviados al navegador. 2. A veces Blade no es suficiente y necesitamos PHP en nuestras plantillas, por ejemplo, para asignar una variable:

Código :

Es posible usar PHP plano dentro de Blade, sólo traten de mantener sus plantillas lo más limpias posibles, limiten el uso de PHP, y si en tal caso lo necesitan, escriban sólo sentencias sencillas y preferiblemente al inicio de la plantilla. Visiten la documentación oficial para obtener más ejemplos sobre Blade Espero les haya gustado este tutorial, recuerden que todo esto se irá profundizando más adelante, por ahora es sólo un bosquejo para que se familiaricen con todos estos conceptos… Stay tuned. Envia un comentario (6)

Introducción a Laravel

Crear un módulo de usuarios con Laravel

Enviar emails con Laravel

Por Luis el 04 de Octubre de 2013 Perfecto me gusta como explicas las cosas, solo tengo una duda al principio dices que es el "cierre de estos tutoriales" que quieres decir con eso :C? Y, en caso de que vuelvas a hacer más, cuando crees que podamos ver uno nuevo? gracias

Por Duilio el 04 de Octubre de 2013 Cierre de la "primera parte" en la segunda parte exlicaré cómo hacer un módulo con Laravel desde 0. Eso sería a partir de la semana que viene.

Por Nico el 06 de Octubre de 2013 Muy bueno! Es básico pero lo explicas muy bien. Laravel es divertido y potente, espero con ansias el tuto de módulos. Gracias!

Por rezme el 06 de Octubre de 2013

Esperando el siguiente tuto

genial

Por xadrijo el 25 de Octubre de 2013 excelente, dulio.

Por Miguel Angel Torres el 06 de Noviembre de 2013 Muchas gracias Dulio. Explicas muy muy bien. Y tú haces que esto sea más divertido. Por favor sigue así con estos tutos tan buenos.

oi ratm no ecut aci lbP u

. . .sedeupo Tu nombre: Escribe tu nombre o nick

No escribas con mayusculas ni como si fuera un SMS.

Tu comentario: Cuentanos en detalle lo quieras opinar

Inicia sesión

Insultos, trolls y spammers son siempre eliminados. [b]negrita[/b] [img]http://url/imagen.jpg[/img] [url=direccion]tu enlace[/url]

Publicar

Blog

¿Estás registrado en Cristalab y quieres publicar tu URL y avatar?

Sé respetuoso. Sé detallado.

Foros

Tutoriales

Tutoriales de Flash

Ejemplos .fla

Anime

Videotutoriales

Cursos

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario? Registrate

Curso de Flash

Curso de HTML

Tags