Generovanie výstupu a Laravel Blade šablóny
Pozrime sa bližšie na to, ako v Laraveli oddelíme generovanie a formátovanie výstupu od logiky aplikácie.
V článku o routingu som uviedol príklad, ako môžeme vygenerovať výstup priamo z route súboru web.php. Vyzeral približne takto:
Route::get('test', function () {
return 'Môj prvý výstup';
});V reálnej aplikácii však budeme generovať zložitejší, štruktúrovaný výstup v HTML. Posielať ho na výstup takýmto spôsobom by bolo veľmi nepraktické, preto využijeme oddelené súbory - šablóny. V Laraveli sú súbory šablón organizované v adresári resources/views a tu bude hľadať naše šablóny aj pomocná funkcia (helper) view. Namiesto vyššie uvedeného príkladu použijeme:
Route::get('test', function () {
return view('test');
});V adresári resources/views vytvoríme súbor test.blade.php (súbory šablón majú koncovku .blade.php). Do príkladu pridám aj základnú HTML štruktúru:
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>Na endpointe /test prehliadač zobrazí nadpis prvej úrovne „Hello World!“
Blade a šablónovanie
Už vieme, ako generovať výstup definovaný v oddelenom súbore. Samo o sebe by nám to však veľmi nepomohlo, pokiaľ by sme museli každé zobrazenie (view) webu definovať ako samostatný nezávislý súbor – množstvo kódu by sa opakovalo a úpravy by boli doslova nočnou morou. Vo vytváraní štruktúry šablón nám pomôže prepracovaný šablonovací engine Blade. Blade je veľmi výkonný nástroj na šablónovanie, ktorý prináša veľké možnosti s minimálnou, resp. žiadnou réžiou navyše vďaka tomu, že šablóny sa prekladajú do PHP a udržiavajú sa medzi úpravami v cache. V Blade šablónach je možné používať aj čisté PHP.
Skladanie šablón
Aby sme zabránili opakovaniu rovnakého kódu v zobrazeniach, opakujúce sa časti môžeme združiť do základnej šablóny, ktorá nám poslúži ako základ, ktorý budeme rozširovať vo vnorených šablónach.
Základnú šablónu nazvem napríklad overall.blade.php. V našom prípade by mohla vyzerať napríklad takto:
<!DOCTYPE html>
<html>
<head>
<title>@yield('title')</title>
</head>
<body>
@yield('content')
</body>
</html>Povedzme, že chceme vytvoriť uvítaciu stránku s nadpisom a krátkym textom. Šablóna nižšej úrovne pages/home.blade.php bude vyzerať napríklad takto:
<!-- pages/home.blade.php -->
@extends('overall')
@section('title', 'Hello World!')
@section('content')
<h1>Hello World!</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
@endsectionBlade syntax je veľmi jasná a väčšina direktív funguje presne tak, ako by ste čakali. Direktíva @extends definuje šablónu, ktorú rozširujeme, @section definuje jednotlivé sekcie rodičovskej šablóny.
Pre vygenerovanie kompletného zobrazenia použijeme šablónu najnižšej úrovne – v tomto prípade home.blade.php:
Route::get('home', function () {
return view('pages.home');
});Všimnite si . Zápis. Dá sa použiť aj klasický zápis pomocou lomítka (forward slash), je však lepšie zvyknúť si na zápis s bodkami, je to totiž štandard, ktorý Laravel využíva aj mimo Blade súborov.
Posielanie dát do šablón
Druhým parametrom funkcie view() je nepovinné pole s predávanými dátami. Kľúče tohto poľa budú v šablóne dostupné ako premenné rovnakého názvu. Ak by sme teda chceli posunúť našej uvítacej šablóne nejaké dáta, môžeme to urobiť takto:
Route::get('home', function () {
return view('pages.home', ['name' => 'John']);
});V súbore šablóny vypíšeme premennú $name
@extends('overall')
@section('title', “Hello {$name}“)
@section('content')
<h1>Hello {{ $name }}!</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
@endsectionSyntax {{ }} zabezpečuje výpis a ide v podstate o volanie PHP funkcie echo. Táto syntax sa používa na tzv. bezpečný výpis. Je zabezpečená proti XSS útokom tým, že vstup prechádza PHP funkciou htmlspecialchars.
Ak potrebujete vypísať neescapovaný obsah, môžete použiť syntax {!! $var !!}, ale rozhodne týmto spôsobom nevypisujte dáta od užívateľa. Mohli by ste sa stať zraniteľný XSS útokom.
Syntax základných kontrolných štruktúr nájdete v dokumentácii.
Vkladanie šablón
Na vloženie obsahu inej šablóny môžeme použiť Blade direktívu @include, ktorá má niekoľko variánt – viď dokumentácia @include.
Základná syntax @include
@include('view.name', ['some' => 'data'])Rovnako ako pri funkcii view, aj tu je druhý parameter – pole predávaných dát nepovinné.
Záver
V článku sme prešli základmi šablónovania a oddeľovania zobrazení od logiky aplikácie. Blade šablóny sú veľmi silným nástrojom na generovanie a formátovanie výstupu aplikácie s priamočiarou, jednoduchou syntaxou. Všetky detaily nájdete v dokumentácii na oficiálnych stránkach. Zaujímavosti a menej bežné direktívy si ukážeme v niektorom z ďalších článkov.
Ešte nie si členom CZ/SK Laravel komunity?
To možeš ľahko zmeniť. Registrácia je zdarma a ako registrovaný člen získaš množstvo výhod. Prečítaj si prečo by si mal byť členom.
Prihlásiť sa Zaregistrovať