Laravel Blade : Maîtrisez le moteur de templating !

Laravel Blade : Maîtrisez le moteur de templating !



Laravel il y a 4 mois

Laravel Blade: Un Moteur de Templating Puissant 

Laravel Blade est le moteur de templating par défaut pour le framework PHP Laravel. Il simplifie la création de pages web dynamiques et réutilisables en intégrant de manière transparente du code PHP dans des modèles HTML. Voici une ventilation des principales fonctionnalités et concepts de Blade :

1. Affichage des Variables:

  • Transmettez des données des contrôleurs ou des routes aux vues Blade à l'aide de la fonction d'assistance view :

PHP

// Contrôleur
return view('bienvenue', ['nom' => 'Jean Dupont']);
  • Accédez aux variables dans les modèles Blade à l'aide de doubles accolades ({{ }}) :

HTML

<h1>Bonjour, {{ $nom }} !</h1>

2. Conditionnels Blade (Si-Sinon) :

  • Utilisez les directives @if, @else et @endif pour contrôler l'affichage du contenu en fonction de conditions :

HTML

@if (count($produits) > 0)
  <ul>
    @foreach ($produits as $produit)
      <li>{{ $produit->nom }}</li>
    @endforeach
  </ul>
@else
  <p>Aucun produit trouvé.</p>
@endif

3. Structures de Boucle (Parcourir et Pour) :

  • Parcourez des collections à l'aide de @foreach et accédez aux éléments individuels :

HTML

@foreach ($utilisateurs as $utilisateur)
  <p>{{ $utilisateur->nom }} ({{ $utilisateur->email }})</p>
@endforeach
  • Utilisez @for pour des boucles personnalisées basées sur des compteurs :

HTML

@for ($i = 0; $i < 5; $i++)
  <p>Itération {{ $i + 1 }}</p>
@endfor

4. Mises en page : Réutilisabilité avec @include, @extends, @section, @yield, et Composants Blade

  • @include: Incluez des composants réutilisables (partiels) dans les mises en page :

HTML

<html>
<head>
  </head>
<body>
  <header>
    @include('layouts.en-tête')
  </header>
  <main>
    @yield('contenu')
  </main>
  <footer>
    @include('layouts.pied-de-page')
  </footer>
</body>
</html>

@extends('layouts.app')

@section('contenu')
  <h1>Bienvenue sur notre site web !</h1>
@endsection
  • @extends: Créez des mises en page de base dont héritent d'autres vues pour la structure :

    • La vue enfant (bienvenue.blade.php) étend la mise en page (app.blade.php) en utilisant @extends.
  • @section: Définissez des sections de contenu au sein des mises en page qui seront remplacées par les vues enfants :

    • La mise en page (app.blade.php) définit un espace réservé @yield('contenu').
  • @yield: Insérez du contenu des vues enfants dans les sections désignées au sein des mises en page :

    • La vue enfant (bienvenue.blade.php) utilise @section('contenu') pour fournir son contenu spécifique.

5. Composants Blade:

  • Créez des composants d'interface utilisateur réutilisables avec une logique et un style encapsulés :

PHP

// app/View/Components/Alerte.php
class Alerte extends BladeComponent
{
    public $type;
    public $message;

    public function render()
    {
        return view('components.alerte');
    }
}

HTML

<div class="alerte alerte-{{ $type }}">
  {{ $message }}
</div>
  • Utilisez les composants dans les modèles Blade comme des éléments HTML ordinaires :

HTML

<x-alerte type="succès" message="Opération réussie !" />

Conseils supplémentaires:

  • Utilisez des séquences d'échappement ({!! !!}) pour autoriser le HTML brut dans Blade :

HTML

{!! $contenu !!}  ```

- Employez les directives Blade pour des tâches courantes telles que les formulaires de protection CSRF :

```html
{{ csrf_field() }}

N'oubliez pas:

Les fichiers Blade se trouvent dans le répertoire resources/views avec l'extension .blade.php.

  • Tirez parti de la documentation de Laravel pour des explications et des exemples détaillés : https://laravel.com/docs/11.x/blade
  • En maîtrisant ces concepts, vous serez bien équipé pour créer des applications Laravel dynamiques, maintenables et bien structurées à l'aide de modèles Blade.