Blade Directives

Sintaks {{ }} hanya menampilkan data, sedangkan keputusan tampilan — cabang logika, perulangan daftar, status login, sampai lingkungan aplikasi — dikerjakan oleh directive. Directive adalah kata kunci berawalan @ yang dikompilasi Blade menjadi struktur kontrol PHP: @if menjadi if, @foreach menjadi foreach, dan seterusnya. Chapter ini memetakan directive yang paling sering dipakai sehari-hari, lalu menguji beberapa di antaranya dengan output nyata agar kita tahu persis apa yang dihasilkannya. Detail tiap kelompok directive kemudian dibedah pada chapter-chapter berikutnya.

Peta Directive yang Sering Dipakai #

Semua directive di atas berpasangan penutup: @if ditutup @endif, @foreach ditutup @endforeach, kecuali yang bersifat argumen tunggal seperti @csrf dan @json. Kebanyakan directive juga menerima argumen kondisi — @continue($loop->index < 3) misalnya — sehingga logika ringkas bisa diletakkan langsung di baris directive tanpa blok @if terpisah. Daftar lengkap beserta detail tiap directive bisa dirujuk di dokumentasi Blade .

@auth dan @guest #

Menu navigasi biasanya menyesuaikan status pengunjung: yang sudah login melihat tautan keluar, yang belum melihat tautan masuk. Directive @auth dan @guest memilih cabangnya secara otomatis:

@auth
    <a href="/keluar">Keluar</a>
@endauth
@guest
    <a href="/masuk">Masuk</a>
@endguest

Request tanpa sesi login menghasilkan cabang @guest:

=== GET /navigasi (belum login) → HTTP 200 ===
<a href="/masuk">Masuk</a>

Untuk cabang @auth, kita gunakan feature test yang login sebagai user [email protected] lewat actingAs():

$user = User::factory()->create([
    'name' => 'Budi Santoso',
    'email' => '[email protected]',
]);

$response = $this->actingAs($user)->get('/navigasi');

$response->assertStatus(200);
$response->assertSee('Keluar');
$response->assertDontSee('Masuk');

Output yang Dihasilkan:

PASS  Tests\Feature\DirectiveAuthTest
✓ navigasi menampilkan keluar saat login                  0.16s

Tests:    1 passed (3 assertions)
Duration: 0.24s

Satu tampilan, dua wajah — tanpa if PHP manual di controller. Kondisi ini dibaca dari session guard aktif, jadi @auth/@guest tetap benar untuk guard bernama lain lewat bentuk @auth('admin').

@production dan @env #

Tombol atau skrip analitik sering hanya boleh tampil di production. Directive @production menyertakan bloknya hanya saat APP_ENV=production, sedangkan @env('local') menyasar lingkungan tertentu:

@env('local')
    <p>Kabar dari lingkungan lokal.</p>
@endenv
@production
    <p>Kabar dari production.</p>
@endproduction

Sandbox course ini berjalan dengan APP_ENV=local, sehingga hasil rendernya:

<p>Kabar dari lingkungan lokal.</p>

Blok @production tidak ikut terkirim. Directive ini juga menerima beberapa lingkungan sekaligus: @env(['staging', 'production']).

@once untuk Konten Sekali Sajian #

Blok di dalam @once hanya dirender sekali meskipun view-nya dieksekusi berkali-kali dalam satu halaman. Skenario klasiknya: partial notifikasi yang di-include dari beberapa tempat — script bawaannya tetap ditulis sekali. Perhatikan view dua-pesan.blade.php yang meng-include partial pesan.blade.php dua kali:

@include('pesan')
@include('pesan')

Isi resources/views/pesan.blade.php:

@once
    <p>Toast notifikasi muncul sekali.</p>
@endonce
<p>Isi pesan.</p>

Output yang Dihasilkan:

<p>Toast notifikasi muncul sekali.</p>
<p>Isi pesan.</p>
<p>Isi pesan.</p>

Paragraf “Isi pesan.” tampil dua kali mengikuti jumlah include, sedangkan isi blok @once hanya sekali. Pola @once biasanya dipadukan dengan @push untuk script library agar tidak dimuat ganda.

@error dan @csrf untuk Form #

Form adalah tempat directive paling padat. @csrf menyisipkan input tersembunyi berisi token sesi; @error('field') menampilkan pesan validasi untuk field tersebut. View tugas/form.blade.php menggabungkan keduanya:

<form method="POST" action="/tugas">
    @csrf
    <input type="text" name="judul" placeholder="Judul tugas">
    <button type="submit">Simpan</button>
    @error('judul')
        <p class="error">{{ $message }}</p>
    @enderror
</form>

Saat validasi gagal, Laravel menyimpan pesan error ke session lalu redirect kembali ke form — variabel $message di dalam @error otomatis terisi dari error bag. Validator bawaan menghasilkan pesan berbahasa Inggris, misalnya The judul field is required. untuk rule required; kita juga bisa mengirim pesan kustom sendiri, dan hasil rendernya tetap sama pola:

<p class="error">Kolom judul wajib diisi.</p>

Nilai token @csrf di-generate acak per sesi, jadi bloknya berbentuk <input type="hidden" name="_token" value="...">. Sebagai pelengkap form, @method('PUT') menyisipkan kolom _method agar form HTML yang hanya mengenal POST bisa memicu route Route::put(...) — trik yang akan kita pakai di section Validasi dan Form . Feature test yang mengirim form kosong lalu membuka ulang halaman form membuktikan pesan error tersebut benar-benar tampil; mekanisme lengkap form akan kita bahas tuntas pada section yang sama.

Preview: @section dan @push #

Dua directive terakhir di tabel adalah pasangan untuk layout. @section/@yield menandai slot bernama — layout menyiapkan kerangka HTML dan halaman anak mengisi slotnya, topik penuh chapter Template Inheritance. Adapun @push/@stack mengumpulkan potongan dari sub-view ke satu titik — misalnya script dari beberapa component menuju satu @stack('scripts') di akhir <body>. Uji nyatanya menghasilkan:

<html>
<body>
    <div id="app">Konten utama.</div>

        <script src="/js/chart.js"></script>
</body>
</html>

Dengan peta directive di tangan, kita mulai membedah kelompok yang paling mendasar: percabangan tampilan dengan @if beserta saudara-saudaranya — materi chapter Conditional Rendering.