Загрузка...

Laravel. Шаблонизатор Blade

Blade в Laravel — полный разбор шаблонизатора с практическими примерами
laravel cover

Если вы работаете с Laravel, то 99% времени ваши шаблоны будут написаны на Blade.
Это встроенный шаблонизатор фреймворка, который компилируется в чистый PHP и практически не даёт оверхеда по производительности.

Но Blade — это не просто {{ $variable }}.

В этой статье разберём:

  • базовый синтаксис
  • наследование шаблонов
  • include и partial’ы
  • компоненты (старые и новые)
  • кастомные директивы
  • производительность
  • архитектурные рекомендации
  • частые ошибки

Статья рассчитана на тех, кто уже пишет на Laravel, но хочет использовать Blade правильно.


Что такое Blade на самом деле

Blade — это компилируемый шаблонизатор.

Это важно понимать.

Он:

  • не интерпретируется на лету
  • не является отдельным движком
  • компилируется в обычный PHP
  • кешируется в storage/framework/views

То есть при первом рендере Laravel превращает .blade.php в обычный PHP-файл и дальше работает уже с ним.

Поэтому разговоры о том, что Blade “медленный” — миф.


Где лежат шаблоны

По умолчанию:

resources/views

Файлы имеют расширение:

.blade.php

Пример:

resources/views/users/index.blade.php

Вызывается так:

return view('users.index');

Laravel сам подставляет .blade.php.


Вывод данных

Экранированный вывод (по умолчанию)

{{ $user->name }}

Blade автоматически делает htmlspecialchars().

Это защита от XSS.

Неэкранированный вывод

{!! $post->content !!}

Использовать только если вы на 100% уверены в источнике данных.


Управляющие конструкции

Blade избавляет от громоздкого PHP:

Условия

@if($user->isAdmin())
    <span>Админ</span>
@endif
@unless($user->isAdmin())
    <span>Не админ</span>
@endunless
@isset($user)
@endisset
@empty($users)
@endempty

Циклы

@foreach($users as $user)
    {{ $user->name }}
@endforeach

Переменная $loop

Blade автоматически даёт доступ к объекту $loop:

@foreach($users as $user)
    {{ $loop->iteration }}. {{ $user->name }}
@endforeach

Доступно:

  • $loop->first
  • $loop->last
  • $loop->iteration
  • $loop->count
  • $loop->even
  • $loop->odd

Это часто удобнее, чем писать счётчики вручную.


Наследование шаблонов (layout)

Это одна из самых сильных сторон Blade.

Базовый layout

resources/views/layouts/app.blade.php
<!DOCTYPE html>
<html>
<head>
    <title>@yield('title', 'RWSite')</title>
</head>
<body>

<header>
    @include('partials.header')
</header>

<main>
    @yield('content')
</main>

<footer>
    @include('partials.footer')
</footer>

</body>
</html>

Дочерний шаблон

@extends('layouts.app')

@section('title', 'Пользователи')

@section('content')
    <h1>Список пользователей</h1>
@endsection

Blade подставит содержимое в @yield.


@parent

Если нужно дополнить родительскую секцию:

@section('sidebar')
    @parent
    <p>Дополнительный блок</p>
@endsection

Include и partial’ы

Обычный include

@include('partials.alert')

Передача данных

@include('partials.alert', ['type' => 'error'])

Условные include

@includeIf('partials.maybe-exists')
@includeWhen($isAdmin, 'partials.admin')
@includeUnless($isGuest, 'partials.member')

@each — рендер списка

@each('partials.user', $users, 'user', 'partials.empty')

Это сокращённый вариант:

@foreach($users as $user)
    @include('partials.user', ['user' => $user])
@endforeach

Компоненты Blade (современный способ)

Начиная с Laravel 7+ компоненты — основной способ структурирования UI.

Создание:

php artisan make:component Alert

Будет создано:

app/View/Components/Alert.php
resources/views/components/alert.blade.php

Использование

<x-alert type="error">
    Что-то пошло не так
</x-alert>

Внутри компонента

<div class="alert alert-{{ $type }}">
    {{ $slot }}
</div>

$slot — это вложенный контент.


Именованные слоты

<x-card>
    <x-slot name="title">
        Заголовок
    </x-slot>

    Контент
</x-card>

Inline компоненты (без класса)

Можно создать только blade-файл:

resources/views/components/badge.blade.php

Использование:

<x-badge color="green">
    Active
</x-badge>

Анонимные компоненты + Tailwind

Blade идеально сочетается с Tailwind (особенно если вы его используете).

Пример:

<div {{ $attributes->merge([
    'class' => 'px-4 py-2 rounded bg-blue-600 text-white'
]) }}>
    {{ $slot }}
</div>

Теперь можно писать:

<x-button class="mt-4">
    Сохранить
</x-button>

Классы объединятся.


Кастомные директивы

Можно создавать свои Blade-директивы.

В AppServiceProvider:

use Illuminate\Support\Facades\Blade;

Blade::directive('datetime', function ($expression) {
    return "<?php echo ($expression)->format('d.m.Y H:i'); ?>";
});

Использование:

@datetime($user->created_at)

Blade и JavaScript (Vue / Alpine)

Если нужно вывести {{ message }} для Vue:

@{{ message }}

Blade уберёт @ и не будет интерпретировать выражение.


Производительность

Blade компилируется в PHP.

При деплое рекомендуется:

php artisan view:cache

Очистка:

php artisan view:clear

Архитектурные рекомендации

❌ Плохо

{{ \App\Models\User::count() }}

Запрос в шаблоне — антипаттерн.


✅ Правильно

В контроллере:

return view('dashboard', [
    'usersCount' => User::count(),
]);

Blade должен:

  • отображать данные
  • не выполнять бизнес-логику
  • не делать запросы
  • не содержать сложных вычислений

Blade + View Models (рекомендуемый подход)

Если проект крупный — используйте ViewModel.

Blade становится максимально чистым:

{{ $viewModel->formattedPrice }}

Никакой логики в шаблоне.


Частые ошибки

  1. Слишком много логики в Blade
  2. SQL-запросы в шаблонах
  3. Использование {!! !!} без проверки данных
  4. Дублирование layout’ов
  5. Отсутствие компонентов

Когда Blade не подходит

Blade — серверный рендеринг.

Если у вас:

  • SPA
  • сложная интерактивность
  • heavy real-time UI

— лучше использовать Inertia или полноценный фронт.

Но для 80% CRUD-проектов Blade более чем достаточен.


Итог

Blade в Laravel — это:

  • быстрый
  • компилируемый
  • удобный
  • мощный
  • архитектурно гибкий инструмент

Если использовать:

  • layout
  • компоненты
  • ViewModel
  • правильное разделение ответственности

— Blade остаётся отличным решением даже для крупных проектов.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *