Blade — це шаблонізатор Laravel, який формує HTML-сторінки. Якщо коротко: контролер готує дані, Blade показує їх користувачу. У Blade не потрібно вирішувати бізнес-логіку, робити SQL чи “вигадувати правила” — він має бути чистим шаром відображення. Коли новачок починає тягнути логіку в шаблон, система швидко перетворюється на хаос: важко знайти, де що змінюється, важко повторно використати блоки і ще важче дебажити.
Щоб сторінки були акуратні, Blade будується як конструктор з чотирьох базових понять: layout, sections, components і partials. Layout — це каркас сторінки, sections — місця, куди підставляється контент, components — повторно використовувані “деталі” з параметрами, partials — шматки HTML, які підключаються як вставки. Якщо ти один раз зрозумієш цей конструктор, ти зможеш робити адмінку і публічні сторінки швидко, не копіюючи одне і те саме по 20 файлах.
Layout — це “рамка” сторінки: шапка, футер, контейнер, підключені стилі та скрипти. Зазвичай у проєкті є базовий layout типу resources/views/layouts/app.blade.php або layouts/main.blade.php. Його сенс у тому, що структура сторінки однакова, а змінюється лише контент. У layout ти визначаєш точки вставки, і саме тут з’являється @yield або @stack для стилів і скриптів.
Sections — це контентні блоки, які “вкладаються” у layout. Коли ти створюєш сторінку, ти пишеш @extends('layouts.main'), а далі визначаєш @section('content') ... @endsection. Це означає: “візьми рамку і встав сюди мій контент”. Так ти отримуєш єдину структуру сайту і не повторюєш шапку, меню і базову розмітку в кожному файлі.
Окремо варто зрозуміти різницю між @section і @push. @section — це заповнення конкретного слота, наприклад контенту сторінки. @push — це накопичення стилів або скриптів у стек, щоб layout міг їх вивести в потрібному місці. Це корисно, коли сторінці потрібен свій маленький скрипт або стиль, але ти не хочеш ламати глобальний layout.
Partials — це прості вставки. Якщо ти бачиш, що один і той самий HTML повторюється на кількох сторінках, ти виносиш його в partial і підключаєш через @include. Типові partials — таблиця списку, рядок таблиці, блок фільтрів, панель кнопок, повідомлення про успіх. Це найшвидший спосіб прибрати копіпаст, коли блок не потребує складних параметрів.
Components — це більш “дорослий” інструмент повторного використання, бо компонент може приймати параметри. Наприклад, кнопка може мати текст, іконку, колір, стан “disabled”. Поле вводу може мати label, name, value, помилку і підказку. Компоненти особливо вигідні в формах: ти перестаєш писати 20 разів однакову верстку input-ів, а починаєш збирати форму як конструктор із готових деталей.
Мінімальний стандарт UI у Blade будується так: сторінка списку, сторінка створення/редагування і кілька маленьких partials/components. Список зазвичай містить заголовок, фільтри, таблицю і пагінацію. Створення/редагування — форму з полями, кнопкою “зберегти” і показом помилок. Це база будь-якої адмінки і перший практичний крок для навчання.
Тепер про простий UI з формами, бо саме тут новачки найчастіше “вмирають”. Форма в HTML — це тег
