9 Les Bases de Laravel 11 : Templates Blade

Anis MarrouchiAI Bot
Par Anis Marrouchi & AI Bot ·

Chargement du lecteur de synthèse vocale...

Blade est le moteur de templates simple mais puissant inclus avec Laravel. Contrairement a certains moteurs de templates PHP, Blade ne vous empeche pas d'utiliser du code PHP pur dans vos templates. En fait, tous les templates Blade sont compiles en code PHP pur et mis en cache jusqu'a ce qu'ils soient modifies, ce qui signifie que Blade n'ajoute essentiellement aucune surcharge a votre application.

Les fichiers de templates Blade utilisent l'extension .blade.php et sont generalement stockes dans le repertoire resources/views. Les vues Blade peuvent etre retournees depuis les routes ou les controllers en utilisant le helper global view:

Route::get('/', function () {
    return view('greeting', ['name' => 'Finn']);
});

Afficher les Donnees

Vous pouvez afficher les donnees passees a vos vues Blade en enveloppant la variable dans des accolades:

Route::get('/', function () {
    return view('welcome', ['name' => 'Samantha']);
});

Vous pouvez afficher le contenu de la variable name comme suit:

Bonjour, {{ $name }}.

Les instructions echo {{ }} de Blade passent automatiquement par la fonction htmlspecialchars de PHP pour prevenir les attaques XSS. Vous n'etes pas limite a l'affichage du contenu des variables passees a la vue; vous pouvez aussi afficher les resultats de n'importe quelle fonction PHP:

Le timestamp UNIX actuel est {{ time() }}.

Directives Blade

En plus de l'heritage de templates et de l'affichage des donnees, Blade fournit des raccourcis pratiques pour les structures de controle PHP courantes, comme les instructions conditionnelles et les boucles.

Instructions If

@if (count($records) === 1)
    J ai un enregistrement!
@elseif (count($records) > 1)
    J ai plusieurs enregistrements!
@else
    Je n ai pas d enregistrements!
@endif

Boucles

@foreach ($users as $user)
    <p>Ceci est l utilisateur {{ $user->id }}</p>
@endforeach
 
@for ($i = 0; $i < 10; $i++)
    La valeur actuelle est {{ $i }}
@endfor
 
@while (true)
    <p>Je boucle pour toujours.</p>
@endwhile

Layouts de Templates

Definir un Layout

<!-- resources/views/layouts/app.blade.php -->
<html>
<head>
    <title>Application - @yield('title')</title>
</head>
<body>
    @section('sidebar')
        Ceci est la barre laterale principale.
    @show
 
    <div class="container">
        @yield('content')
    </div>
</body>
</html>

Etendre un Layout

<!-- resources/views/child.blade.php -->
@extends('layouts.app')
 
@section('title', 'Titre de la Page')
 
@section('sidebar')
    @parent
    <p>Ceci est ajoute a la barre laterale principale.</p>
@endsection
 
@section('content')
    <p>Ceci est mon contenu principal.</p>
@endsection

Composants

Blade fournit un moyen puissant de creer des composants reutilisables:

php artisan make:component Alert
<!-- resources/views/components/alert.blade.php -->
<div class="alert alert-{{ $type }}">
    {{ $slot }}
</div>

Utilisation du composant:

<x-alert type="success">
    Donnees sauvegardees avec succes!
</x-alert>

En savoir plus sur les templates Blade dans Laravel depuis la documentation officielle.

Conclusion

Blade est un moteur de templates puissant et flexible qui rend la construction d'interfaces utilisateur dans Laravel facile et agreable. Avec ses nombreuses fonctionnalites de directives, composants et layouts, vous pouvez construire des applications web complexes avec un code propre et maintenable.

Bon codage avec Laravel 11!


Vous voulez lire plus de tutoriels? Découvrez notre dernier tutoriel sur Explorer Transformers.js.

Discutez de votre projet avec nous

Nous sommes ici pour vous aider avec vos besoins en développement Web. Planifiez un appel pour discuter de votre projet et comment nous pouvons vous aider.

Trouvons les meilleures solutions pour vos besoins.

Articles connexes

10 Les Bases de Laravel 11 : Bundling d'Assets

Apprenez les essentiels du bundling d'assets dans Laravel 11 avec Vite, couvrant l'installation, la configuration et des exemples pratiques pour le developpement web.

10 min read·