Sinau Uki

06. Sintaks Dasar Blade ​

Pada materi sebelumnya, kita telah memahami peran konseptual Blade sebagai template engine bawaan Laravel yang bertugas menyajikan tampilan antarmuka di sisi server. Sekarang, saatnya kita melangkah ke tahap praktik dengan mempelajari sintaksis, struktur kontrol, pewarisan tata letak (layout inheritance), hingga proteksi formulir yang digunakan sehari-hari dalam membangun aplikasi web.

A. Pengantar ​

Ketika mengembangkan fitur tampilan pada aplikasi Laravel, Anda akan menghabiskan banyak waktu di dalam berkas berekstensi .blade.php. Blade dirancang agar Anda tetap dapat menulis kode HTML murni, namun dengan tambahan sintaks praktis yang diawali dengan kurung kurawal ganda atau simbol at (@) yang disebut directives.

Sepanjang materi ini, kita akan menggunakan konteks nyata dari project yang sedang kita bangun, yaitu Aplikasi Sistem Informasi Perpustakaan. Kita akan melihat bagaimana data judul buku, status ketersediaan peminjaman, serta formulir pendaftaran anggota diolah dan disajikan secara elegan ke layar pengguna.

B. Menampilkan Data (Echoing) ​

Cara paling mendasar untuk mencetak nilai variabel ke dalam dokumen HTML pada Blade adalah dengan menggunakan kurung kurawal ganda:

{{ $variabel }}

1. Alur Pengiriman Data dari Route ke Blade ​

Data biasanya disiapkan pada berkas rute (routes/web.php) atau Controller, kemudian diteruskan ke fungsi helper view().

Contoh pada routes/web.php:

php
use Illuminate\Support\Facades\Route;

Route::get('/profil-perpustakaan', function () {
    $namaPerpus = 'Perpustakaan Sinau Uki';
    $tahunBerdiri = 2024;

    return view('profil', [
        'nama' => $namaPerpus,
        'tahun' => $tahunBerdiri
    ]);
});

2. Menerima dan Menampilkan Variabel di Blade ​

Pada berkas resources/views/profil.blade.php, data yang dikirim melalui array otomatis dikenali sebagai variabel PHP independen sesuai nama kuncinya:

html
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>Profil Perpustakaan</title>
</head>
<body>
    <h1>Selamat Datang di {{ $nama }}</h1>
    <p>Melayani pembaca sejak tahun {{ $tahun }}.</p>
</body>
</html>

3. Escaped Output vs Unescaped Output ​

Blade memberikan proteksi keamanan tingkat tinggi secara otomatis:

  • Escaped Output (Bawaan Aman): Sintaks {{ $data }} otomatis dibungkus dengan fungsi PHP htmlspecialchars() untuk mengonversi karakter khusus HTML. Jika ada pengguna yang memasukkan teks berbahaya seperti <script>alert('xss')</script>, Blade mencetaknya sebagai teks biasa: &lt;script&gt;alert('xss')&lt;/script&gt;.
  • Unescaped Output (Format Mentah): Sintaks {!! $data !!} mencetak teks apa adanya tanpa penyaringan entitas HTML.

Peringatan Keamanan

Jangan pernah menggunakan sintaks unescaped {!! $data !!} untuk menampilkan data yang berasal dari input pengguna luar (seperti form komentar, nama buku yang diinputkan pengguna, atau input pencarian). Penggunaan yang tidak tepat membuka celah kerentanan Cross-Site Scripting (XSS).

C. Komentar Blade ​

Dalam menulis kode template, Anda sering kali perlu menyematkan catatan penjelasan teknis tanpa ingin catatan tersebut dibaca oleh pengguna umum di browser.

Blade menyediakan sintaks komentar khusus:

blade
{{-- Ini adalah komentar Blade. Teks ini tidak akan dirender ke browser. --}}

Perbedaan Komentar Blade dan Komentar HTML ​

AspekKomentar HTML (<!-- -->)Komentar Blade ({{-- --}})
Lokasi EksekusiBrowser klienServer saat kompilasi
Muncul di View Source?Ya, dapat dibaca oleh publikTidak, dihapus total oleh compiler Blade
Penggunaan IdealMenandai struktur pembungkus CSSCatatan logika data dan penjelasan kode rahasia

Contoh perbandingan:

blade
<!-- Bagian Header Katalog (Terlihat di Inspect Element) -->
<header>
    <h1>Katalog Buku</h1>
    {{-- TODO: Tambahkan filter kategori buku minggu depan --}}
</header>

Saat halaman di atas dibuka di browser dan pengunjung memilih menu View Source, catatan TODO sama sekali tidak terlihat.

D. Conditional Statement (Percabangan Logika) ​

Blade menyediakan directive kondisional yang sangat intuitif untuk mengatur kapan suatu elemen HTML harus ditampilkan berdasarkan status data aplikasi perpustakaan.

1. Directive @if, @elseif, dan @else ​

Digunakan untuk memeriksa kondisi logika standar:

blade
@if ($stokBuku > 5)
    <span class="badge badge-success">Stok Melimpah ({{ $stokBuku }} eksemplar)</span>
@elseif ($stokBuku > 0)
    <span class="badge badge-warning">Stok Terbatas (Sisa {{ $stokBuku }})</span>
@else
    <span class="badge badge-danger">Stok Habis</span>
@endif

2. Directive @unless ​

Merupakan kebalikan dari @if. Blok di dalam @unless hanya dieksekusi jika kondisi bernilai false:

blade
{{-- Tampilkan tombol pinjam jika buku TIDAK sedang dipinjam --}}
@unless ($isDipinjam)
    <button class="btn btn-primary">Ajukan Peminjaman</button>
@endunless

Kode di atas setara dengan menulis @if (!$isDipinjam).

3. Directive @isset dan @empty ​

  • @isset($variabel): Memeriksa apakah suatu variabel sudah didefinisikan dan nilainya bukan null.
  • @empty($variabel): Memeriksa apakah suatu variabel kosong (seperti array tanpa elemen, string kosong, atau nilai 0).
blade
@isset($catatanPetugas)
    <p class="catatan">Catatan: {{ $catatanPetugas }}</p>
@endisset

@empty($daftarPeminjam)
    <p class="alert">Saat ini tidak ada anggota yang sedang meminjam buku ini.</p>
@endempty

E. Perulangan (Loops) ​

Menampilkan kumpulan data (koleksi buku, riwayat transaksi, daftar pengarang) membutuhkan perulangan. Blade menyediakan directive perulangan yang rapi dan bebas dari kerumitan tag pembuka-penutup PHP.

1. Directive @foreach ​

Digunakan untuk mengulang data array atau koleksi data dari database:

blade
<ul>
    @foreach ($bukuList as $buku)
        <li>
            <strong>{{ $buku['judul'] }}</strong> - Penulis: {{ $buku['penulis'] }}
        </li>
    @endforeach
</ul>

2. Directive @forelse (Solusi Praktis Koleksi Kosong) ​

Pada pembuatan web, Anda sangat sering menghadapi situasi di mana data koleksi bisa berisi beberapa item, atau justru kosong sama sekali.

Alih-alih menulis @if (count($bukuList) > 0) yang membungkus @foreach, Blade menyediakan directive terpadu bernama @forelse:

blade
<div class="katalog-container">
    @forelse ($bukuList as $buku)
        <div class="card-buku">
            <h3>{{ $buku['judul'] }}</h3>
            <p>Kategori: {{ $buku['kategori'] }}</p>
        </div>
    @empty
        <div class="pesan-kosong">
            <p>Belum ada data buku yang terdaftar di sistem perpustakaan.</p>
        </div>
    @endforelse
</div>

Jika array $bukuList berisi data, bagian pertama akan diulang. Namun jika array kosong, Blade otomatis melompat dan merender blok di bawah @empty.

3. Directive @for dan @while ​

Blade juga tetap mendukung perulangan berbasis hitungan indeks angka:

blade
{{-- Menampilkan nomor rak buku dari 1 sampai 5 --}}
@for ($rak = 1; $rak <= 5; $rak++)
    <span>Rak Nomor {{ $rak }}</span>
@endfor

4. Variabel Sakti $loop ​

Di dalam perulangan @foreach atau @forelse, Blade secara otomatis menyediakan variabel khusus bernama $loop untuk mengetahui informasi putaran perulangan:

blade
@foreach ($bukuList as $buku)
    <div class="baris-buku">
        <span>No. Urut: {{ $loop->iteration }}</span>
        <span>Judul: {{ $buku['judul'] }}</span>

        @if ($loop->first)
            <span class="badge">Buku Paling Baru</span>
        @endif

        @if ($loop->last)
            <span class="badge">Buku Terakhir</span>
        @endif
    </div>
@endforeach
  • $loop->iteration: Menghasilkan nomor urut mulai dari angka 1.
  • $loop->first: Bernilai true jika perulangan sedang berada di elemen pertama.
  • $loop->last: Bernilai true jika perulangan sedang berada di elemen terakhir.

F. Template Inheritance (Pewarisan Layout) ​

Salah satu kekuatan terbesar Blade adalah kemampuannya menyusun halaman web modular tanpa menulis ulang struktur dasar HTML, navbar, dan footer pada setiap berkas.

Tiga directive kunci dalam template inheritance:

  1. @yield('nama_bagian'): Diletakkan di layout induk sebagai penanda area kosong yang akan diisi oleh halaman anak.
  2. @extends('nama_layout'): Diletakkan di baris pertama halaman anak untuk menyatakan bahwa berkas ini mewarisi kerangka layout induk.
  3. @section('nama_bagian'): Membungkus konten spesifik pada halaman anak yang akan disuntikkan ke dalam @yield yang cocok di layout induk.

1. Berkas Layout Induk (resources/views/layouts/app.blade.php) ​

html
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@yield('title', 'Sistem Perpustakaan')</title>
    <link rel="stylesheet" href="/css/style.css">
</head>
<body>
    <!-- Bilah Navigasi Utama -->
    <nav class="navbar">
        <a href="/" class="logo">Perpustakaan Digital</a>
        <div class="nav-links">
            <a href="/buku">Katalog Buku</a>
            <a href="/peminjaman">Peminjaman</a>
        </div>
    </nav>

    <!-- Konten Utama Halaman -->
    <main class="container">
        @yield('content')
    </main>

    <!-- Catatan Kaki -->
    <footer class="footer">
        <p>&copy; 2026 Sinau Uki - Modul Praktikum Web Programming.</p>
    </footer>
</body>
</html>

2. Berkas Halaman Anak (resources/views/buku/index.blade.php) ​

blade
@extends('layouts.app')

@section('title', 'Daftar Koleksi Buku')

@section('content')
    <div class="page-header">
        <h1>Katalog Buku Perpustakaan</h1>
        <p>Temukan koleksi buku referensi dan buku ajar terkini.</p>
    </div>

    <div class="katalog-grid">
        <p>Konten daftar buku ditampilkan di sini.</p>
    </div>
@endsection

Cara Keduanya Terhubung: ​

  1. Halaman anak memanggil @extends('layouts.app').
  2. Laravel memuat berkas resources/views/layouts/app.blade.php.
  3. Teks 'Daftar Koleksi Buku' pada @section('title', ...) disuntikkan ke bagian <title>@yield('title')</title>.
  4. Seluruh elemen HTML di dalam @section('content') ... @endsection disuntikkan tepat di dalam tag <main class="container">@yield('content')</main>.

G. Include dan Partial View ​

Jika Template Inheritance bekerja dengan cara halaman anak mengisi kerangka induk, directive @include bekerja dengan cara menyisipkan sepotong kecil berkas tampilan ke dalam berkas tampilan lainnya.

Sintaks dasar: @include('nama.berkas')

Contoh Struktur Berkas Tampilan dengan Partials: ​

resources/views/
├── layouts/
│   └── app.blade.php             # Layout utama
├── partials/
│   ├── navbar.blade.php          # Potongan bilah navigasi
│   ├── footer.blade.php          # Potongan catatan kaki
│   └── alert.blade.php           # Potongan kotak notifikasi
└── buku/
    └── index.blade.php           # Halaman katalog buku

Contoh Penerapan @include di Layout Induk: ​

Berkas resources/views/layouts/app.blade.php:

html
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <title>@yield('title')</title>
</head>
<body>
    {{-- Sisipkan potongan navbar dari folder partials --}}
    @include('partials.navbar')

    <main class="container">
        @include('partials.alert')
        @yield('content')
    </main>

    {{-- Sisipkan potongan footer dari folder partials --}}
    @include('partials.footer')
</body>
</html>

Perbedaan @extends vs @include: ​

  • @extends (Pewarisan): Digunakan sekali di bagian paling atas halaman anak untuk mengambil kerangka luar sebuah halaman.
  • @include (Komposisi): Digunakan berkali-kali di mana saja untuk menempelkan potongan elemen UI statis atau potongan kode yang berdiri sendiri.

H. Blade Components (Komponen Mandiri) ​

Selain partial view tradisional, Laravel modern menyediakan fitur Blade Components. Komponen memungkinkan pembuatan elemen antarmuka yang lebih mandiri, terisolasi, dan dapat menerima parameter data (props) secara eksplisit.

1. Mengenal Anonymous Component ​

Anonymous component adalah komponen Blade yang dibuat cukup dengan membuat berkas template di dalam folder khusus: resources/views/components/

2. Membuat Komponen Kotak Informasi (resources/views/components/alert.blade.php) ​

blade
@props([
    'tipe' => 'info',
    'pesan'
])

<div class="alert alert-{{ $tipe }}">
    <strong>Pemberitahuan:</strong> {{ $pesan }}
</div>

3. Memanggil Komponen pada Halaman Blade ​

Di halaman mana pun, komponen di dalam folder components/ dapat dipanggil menggunakan tag kustom dengan awalan <x-...>:

blade
{{-- Menggunakan nilai default tipe "info" --}}
<x-alert pesan="Buku berhasil ditambahkan ke daftar bacaan." />

{{-- Mengirimkan nilai tipe khusus --}}
<x-alert tipe="warning" pesan="Masa peminjaman buku Anda tersisa 2 hari lagi." />

Keunggulan Komponen dibandingkan Partial View: ​

  • Penulisan tag terasa seperti elemen HTML murni (<x-alert>).
  • Mendukung penetapan nilai parameter bawaan (default props) secara eksplisit melalui directive @props.

I. Formulir HTML dan Proteksi CSRF ​

Formulir adalah media utama bagi pengguna untuk mengirimkan data ke server (misalnya form input buku baru atau form peminjaman). Laravel mengintegrasikan Blade secara mendalam untuk menangani aspek keamanan dan validasi form.

1. Directive @csrf (Wajib untuk Method POST) ​

Setiap formulir HTML yang mengirimkan data menggunakan method POST, PUT, PATCH, atau DELETE wajib menyertakan directive:

blade
@csrf

Di balik layar, directive @csrf menghasilkan tag input tersembunyi (hidden input) yang berisi token keamanan rahasia:

html
<input type="hidden" name="_token" value="d7a8F9...token_acak...">

Mengapa Token CSRF Dibutuhkan? ​

Serangan CSRF (Cross-Site Request Forgery) terjadi ketika situs jahat memperdaya browser pengguna yang sedang login untuk mengirimkan perintah berbahaya tanpa disadari (misalnya menghapus akun atau mentransfer dana).

Dengan mewajibkan token @csrf, Laravel memastikan bahwa setiap permintaan pengubahan data benar-benar berasal dari aplikasi perpustakaan Anda sendiri, bukan dari situs lain.

2. Directive @method (Spoofing Method HTTP) ​

Formulir HTML standar browser hanya mendukung pengiriman melalui method GET dan POST. Jika Anda ingin mengirimkan request untuk pembaruan data (PUT) atau penghapusan data (DELETE), gunakan directive @method:

blade
<form action="/buku/1" method="POST">
    @csrf
    @method('PUT')
    <!-- Input data -->
</form>

3. Directive @error dan Helper old() ​

Ketika input data gagal memenuhi validasi server (misalnya judul buku kosong):

  • Helper old('nama_field') berfungsi mengembalikan nilai yang sebelumnya sudah diketikkan pengguna agar mereka tidak perlu mengetik ulang dari awal.
  • Directive @error('nama_field') berfungsi menangkap pesan kesalahan validasi secara otomatis.

Contoh Formulir Lengkap Input Buku Perpustakaan ​

blade
<form action="/buku" method="POST" class="form-tambah">
    @csrf

    <div class="form-group">
        <label for="judul">Judul Buku</label>
        <input 
            type="text" 
            id="judul" 
            name="judul" 
            value="{{ old('judul') }}"
            class="form-control"
        >
        @error('judul')
            <p class="text-danger">{{ $message }}</p>
        @enderror
    </div>

    <div class="form-group">
        <label for="penulis">Nama Penulis</label>
        <input 
            type="text" 
            id="penulis" 
            name="penulis" 
            value="{{ old('penulis') }}"
            class="form-control"
        >
        @error('penulis')
            <p class="text-danger">{{ $message }}</p>
        @enderror
    </div>

    <button type="submit" class="btn btn-success">Simpan Koleksi</button>
</form>

J. Contoh Praktik: Menampilkan Katalog Buku ​

Mari kita rangkum materi di atas menjadi sebuah latihan terpadu. Kita akan membuat halaman katalog buku perpustakaan sederhana yang menggabungkan rute data, layout inheritance, perulangan @forelse, dan percabangan status ketersediaan.

Latihan ini menggunakan array PHP murni di rute sehingga dapat langsung Anda coba tanpa harus membuat database terlebih dahulu.

Langkah 1: Siapkan Rute dan Data di routes/web.php ​

Buka berkas routes/web.php pada project Laravel Anda dan tambahkan rute pengujian berikut:

php
use Illuminate\Support\Facades\Route;

Route::get('/katalog-buku', function () {
    $koleksiBuku = [
        [
            'id' => 1,
            'judul' => 'Pemrograman Web Modern dengan PHP 8.3',
            'penulis' => 'Budi Raharjo',
            'tahun' => 2024,
            'tersedia' => true,
        ],
        [
            'id' => 2,
            'judul' => 'Arsitektur Aplikasi Laravel 13',
            'penulis' => 'Siti Aminah',
            'tahun' => 2025,
            'tersedia' => false,
        ],
        [
            'id' => 3,
            'judul' => 'Dasar Perancangan Basis Data Relasional',
            'penulis' => 'Ahmad Fauzi',
            'tahun' => 2023,
            'tersedia' => true,
        ],
    ];

    return view('buku.katalog', [
        'daftarBuku' => $koleksiBuku
    ]);
});

Langkah 2: Buat Berkas Layout Induk di resources/views/layouts/app.blade.php ​

html
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@yield('title', 'Perpustakaan Sinau Uki')</title>
    <style>
        body { font-family: sans-serif; background: #f8fafc; margin: 0; padding: 20px; color: #1e293b; }
        .container { max-width: 800px; margin: 0 auto; background: #ffffff; padding: 24px; border-radius: 8px; border: 1px solid #e2e8f0; }
        .nav { margin-bottom: 20px; padding-bottom: 12px; border-bottom: 1px solid #e2e8f0; }
        .badge { padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: bold; }
        .badge-success { background: #dcfce7; color: #15803d; }
        .badge-danger { background: #fee2e2; color: #b91c1c; }
        .item-buku { border-bottom: 1px solid #f1f5f9; padding: 12px 0; }
    </style>
</head>
<body>
    <div class="container">
        <nav class="nav">
            <strong>Sinau Uki Library</strong> | <a href="/katalog-buku">Katalog Buku</a>
        </nav>

        @yield('content')
    </div>
</body>
</html>

Langkah 3: Buat Berkas View Anak di resources/views/buku/katalog.blade.php ​

blade
@extends('layouts.app')

@section('title', 'Katalog Koleksi Buku')

@section('content')
    <h2>Daftar Koleksi Buku</h2>
    <p>Total koleksi yang ditampilkan: {{ count($daftarBuku) }} buku.</p>

    <div class="daftar-katalog">
        @forelse ($daftarBuku as $buku)
            <div class="item-buku">
                <h3>{{ $loop->iteration }}. {{ $buku['judul'] }}</h3>
                <p>Penulis: {{ $buku['penulis'] }} (Tahun: {{ $buku['tahun'] }})</p>

                <p>Status:
                    @if ($buku['tersedia'])
                        <span class="badge badge-success">Tersedia untuk Dipinjam</span>
                    @else
                        <span class="badge badge-danger">Sedang Dipinjam</span>
                    @endif
                </p>
            </div>
        @empty
            <p>Belum ada buku yang tercatat di katalog saat ini.</p>
        @endforelse
    </div>
@endsection

Langkah 4: Uji Coba pada Browser ​

  1. Jalankan development server melalui terminal:
    bash
    php artisan serve
  2. Buka peramban web dan akses alamat: http://localhost:8000/katalog-buku
  3. Anda akan melihat daftar buku dengan nomor urut otomatis, rincian penulis, serta label status ketersediaan berwarna hijau atau merah sesuai kondisi masing-masing data.

K. Latihan Mandiri ​

Untuk menguji pemahaman Anda mengenai sintaks Blade, kerjakan latihan berikut secara mandiri:

Soal Latihan: ​

  1. Latihan 1 (Menampilkan Variabel Dinamis): Buat rute /anggota yang mengirimkan data string nama anggota dan string nomor anggota. Tampilkan data tersebut di dalam berkas view menggunakan sintaks kurung kurawal ganda.
  2. Latihan 2 (Percabangan Status Akun): Tambahkan variabel boolean $isAktif ke dalam data anggota pada Latihan 1. Gunakan directive @if dan @else untuk menampilkan label "Akun Aktif" berwarna hijau atau "Akun Ditangguhkan" berwarna merah.
  3. Latihan 3 (Perulangan Data Riwayat): Kirimkan sebuah array $riwayatPinjam berisi judul buku yang pernah dipinjam. Tampilkan daftar riwayat tersebut dalam bentuk list HTML (<ol>) menggunakan directive @forelse. Ujilah tampilan saat array berisi data dan saat array dikosongkan.
  4. Latihan 4 (Pewarisan Tata Letak): Buat master layout sederhana bernama layouts/master.blade.php yang memiliki navbar statis dan footer statis. Hubungkan halaman riwayat anggota dari Latihan 3 ke layout master tersebut menggunakan @extends dan @section.
Petunjuk Solusi Latihan
  • Latihan 1: Pastikan nama kunci pada array rute cocok dengan variabel yang dipanggil di Blade, misalnya ['namaAnggota' => 'Ahmad'] dipanggil dengan <code v-pre></code>.
  • Latihan 2: Gunakan struktur @if ($isAktif) ... @else ... @endif.
  • Latihan 3: Jangan lupa menyertakan bagian @empty di dalam @forelse agar pesan penjelas muncul saat riwayat pinjam kosong.
  • Latihan 4: Pastikan letak folder layout berada di resources/views/layouts/master.blade.php dan dipanggil dengan @extends('layouts.master').

L. Kesimpulan ​

Berikut ringkasan referensi cepat sintaks dan directive Blade yang telah kita pelajari:

Directive / SintaksKategoriFungsi UtamaContoh Singkat
{{ $data }}OutputMencetak data aman (auto-escape XSS){{ $buku->judul }}
{!! $data !!}OutputMencetak data mentah tanpa escaping{!! $deskripsiHtml !!}
{{-- ... --}}KomentarKomentar server yang tidak tampil di browser{{-- Catatan pengembang --}}
@if ... @endifKondisionalMemeriksa ekspresi logika bernilai true@if ($stok > 0) Tersedia @endif
@unless ... @endunlessKondisionalMenjalankan blok jika kondisi bernilai false@unless ($isDipinjam) Pinjam @endunless
@isset ... @endissetKondisionalMemeriksa apakah variabel terdefinisi@isset($catatan) {{ $catatan }} @endisset
@empty ... @endemptyKondisionalMemeriksa apakah variabel bernilai kosong@empty($buku) Data kosong @endempty
@foreach ... @endforeachPerulanganMengulang setiap item data koleksi/array@foreach ($buku as $b) ... @endforeach
@forelse ... @emptyPerulanganMengulang koleksi dengan fallback data kosong@forelse ($buku as $b) ... @empty ... @endforelse
@extends('layout')InheritanceMenentukan kerangka layout induk@extends('layouts.app')
@section('konten')InheritanceMembungkus konten spesifik halaman anak@section('content') ... @endsection
@yield('konten')InheritanceMenandai slot yang akan diisi di layout induk@yield('content')
@include('partial')Sub-viewMenyisipkan potongan template terpisah@include('partials.navbar')
&lt;x-komponen /&gt;KomponenMemanggil Blade component mandiri&lt;x-alert pesan="Berhasil" /&gt;
@csrfKeamananMenghasilkan token proteksi Cross-Site Request Forgery@csrf
@method('PUT')FormulirMeniru method HTTP PUT/PATCH/DELETE@method('PUT')
@error('field')ValidasiMenampilkan pesan error validasi input@error('judul') {{ $message }} @enderror

M. Materi Selanjutnya ​

Sekarang Anda telah menguasai sintaks dasar yang dibutuhkan untuk membangun antarmuka dinamis pada Laravel.

Pada materi berikutnya, kita akan mempelajari arsitektur alur kerja lengkap dari hulu ke hilir: 👉 07. Cara Kerja Laravel dan Blade: Membedah bagaimana sebuah permintaan HTTP dari browser diproses melalui rute, diteruskan ke controller, berinteraksi dengan database melalui model, hingga akhirnya dirender menjadi halaman HTML utuh oleh Blade.

Referensi Dokumentasi ​