05-blade-101.md

Blade 101

Nous avons déjà vu brièvement le moteur de template Blade, on va maintenant voir plus de détails. Blade est le moteur de template de laravel, grâce aux directives, il nous permet d'écrire du code plus simple et plus lisible qu'avec les balises PHP.
Commençons par créer un contrôleur ArticlesController

php artisan make:controller ArticlesController

Voici le contenu de contrôleur

class ArticlesController extends Controller
{
    public function index()
    {
        $articles = [
            ['title' => 'titre article 1', 'body' => 'Contenu de l\'article 1'],
            ['title' => 'titre article 2', 'body' => 'Contenu de l\'article 2'],
            ['title' => 'titre article 3', 'body' => 'Contenu de l\'article 3'],
        ];
    
        return view('layouts.articles', compact('articles'));
    }
}

Une méthode index où on simule une requête SQL, comme dans notre fichier web.php précédemment, la méthode view() renvoie la vue demandée, ici avec un tableau comportant des articles de blog. La variable $articles sera mise à disposition automatiquement dans notre fichier.
On ajoute une route :

use App\Http\Controllers\ArticlesController;

Route::get('/articles', [ArticlesController::class, 'index']);

On ajoute un lien <a href="/articles">Articles</a> dans le fichier master.blade.php et une vue articles.blade.php dans le dossier layouts.

On peut maintenant naviguer jusqu'à l'URL suivante http://127.0.0.1:8000/articles. Voici le contenu du fichier articles

@extends('layouts.master')

@section('title')
    Articles
@endsection

@section('content')
    <h2>Articles</h2>
@endsection

On a rajouté une section @section('title') qui correspond au titre de la page. Ensuite on a modifié le fichier master pour inclure dans le balises title

<title>@yield('title')</title>

Quelques directives :

@foreach

Dans le contrôleur, on retourne une liste d'articles, voyons comment les afficher avec le 'blade template engine' :

@foreach($articles as $article)
    <p>{{ $article['title'] }}</p>
    <p>{{ $article['body'] }}</p>
@endforeach

Rien de compliqué avec cette boucle que vous devez déjà maîtriser. Pas besoin d'ouvrir des balises PHP, les directives blade sont suffisantes. Notez tout de même qu'en cas de besoin, vous avez la possibilité d'écrire du code PHP directement, dans ce cas les directives sont les suivantes :

@php
    // Votre code 
@endphp

@if / @else

Les directives @if et @else se passe de commentaires, voici un exemple :

@if($articles)
    @foreach($articles as $article)
        <p>{{ $article['title'] }}</p>
        <p>{{ $article['body'] }}</p>
    @endforeach
@else
    <p>Pas d'articles disponible</p>
@endif

Si besoin, la directive @elseif est disponible. Les directives @foreach et @if / @else ci-dessus nous permettent d'afficher des articles s'il y en a, sinon un message. Pour remplacer le combo @if / @else, la directive @unless pourra vous aider :

@unless(! $articles)
    @foreach($articles as $article)
        @include('articles.index')
    @endforeach
@endunless

Une autre boucle, moins intuitive, mais bien plus propre, permettant d'obtenir le même résultat :

@forelse / @empty

@forelse($articles as $article)
    <p>{{ $article['title'] }}</p>
    <p>{{ $article['body'] }}</p>
@empty
    <p>Pas d'articles disponible.</p>
@endforelse

Le résultat est exactement le même.

@each

Enfin une dernière boucle, qui nécessite de modifier notre structure de dossiers : Dans le dossier resources/views, on crée un dossier articles, on y crée un fichier index.blade.php, dont voici le contenu :

<p>{{ $article['title'] }}</p>
<p>{{ $article['body'] }}</p>

On crée aussi un fichier no-articles.blade.phpet on y met <p>Pas d'articles disponible.</p> Voici notre dernière boucle que l'on écrit dans le fichier articles.blade.php :

@each('articles.index', $articles, 'article', 'articles.no-articles')

• Le premier argument est le fichier que l'on veut inclure.
• le second est notre liste d'articles.
• le troisième est le nom de la variable à laquelle sera assigné la valeur de l'itération en cours.
• le dernier est le fichier inclut si il n'y a pas d'articles.

Une seule ligne pour remplacer les autres boucles, faut avouer que c'est pas mal du tout.

@include

Maintenant qu'on a ces différents fichier, profitons en pour modifier les boucles écrites précédemment :

@if($articles)
    @foreach($articles as $article)
        @include('articles.index')
    @endforeach
@else
    @include('articles.no-articles')
@endif

@forelse($articles as $article)
    @include('articles.index')
@empty
    @include('articles.no-articles')
@endforelse

La directive @include se passe de commentaires.

Les commentaires

Si jamais vous devez en mettre :

{{-- Vos commentaires ... --}}
{{-- 
    Vos commentaires ...
    sur plusieurs lignes
--}}

À propos de la syntaxe moustache :

{{ $article['body'] }}

Notez que cette syntaxe est équivalente à :

echo htmlspecialchars($article['body']);

La variable est automatiquement passé dans htmlspecialchars. Si pour une raison où une autre vous ne souhaitez pas échapper les données, voici la syntaxe :

{!! $article['body'] !!}

Autres directives

Voici d'autre directives simple avec lesquelles vous devrez expérimenter :

@for ($i = 0; $i < 10; $i++)
    {{-- code... --}}
@endfor

@while (true)
    {{-- code... --}}
@endwhile

Nous reviendrons sur blade plus tard pour les directives plus avancées, le temps d'apprendre d'autre notions du framework.