> For the complete documentation index, see [llms.txt](https://learn.devlabss.my.id/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://learn.devlabss.my.id/laravel/bab-3-blade-templating/3.4-penjelasan-alur-kerja-layout.md).

# 3.4 Penjelasan Alur Kerja Layout

## Penjelasan alur kerja layout

Setelah mencoba `@extends` dan `@include`, sekarang Anda perlu memahami alurnya.

Tujuannya sederhana:

**Blade membantu Anda menulis file yang rapi, tetapi browser tetap menerima satu halaman HTML utuh.**

### Gambaran besar alurnya

Saat halaman `/beranda` dibuka, Laravel tidak langsung mengirim isi satu file saja.

Laravel lebih dulu menggabungkan beberapa bagian:

* layout utama
* komponen kecil seperti navbar
* isi halaman

Setelah semuanya digabung, hasil akhirnya dikirim ke browser.

### Peran setiap directive

Gunakan ringkasan ini:

* `@extends` — memilih layout utama
* `@section` — menyiapkan isi halaman
* `@yield` — menyediakan tempat kosong di layout
* `@include` — menyisipkan komponen kecil

Jika disederhanakan:

```
beranda.blade.php -> memakai layout utama -> mengisi area konten -> layout juga menyisipkan navbar
```

### Alur kerja saat `/beranda` dibuka

Misalnya Anda membuka route `/beranda`.

Urutannya kurang lebih seperti ini:

1. Browser mengirim request ke route `/beranda`.
2. Route menjalankan `view('beranda')`.
3. Laravel membaca file `beranda.blade.php`.
4. Laravel melihat `@extends('layouts.app')`.
5. Laravel membuka file `layouts/app.blade.php`.
6. Laravel menemukan `@include('layouts.navbar')` lalu menyisipkan navbar.
7. Laravel menemukan `@yield('konten')`.
8. Laravel mengambil isi dari `@section('konten')` milik `beranda.blade.php`.
9. Laravel menggabungkan semuanya menjadi hasil akhir.
10. Hasil itu dikirim ke browser sebagai HTML.

Dalam bentuk ringkas:

```
Browser -> route -> view('beranda') -> layout utama -> include navbar -> isi section -> HTML akhir -> Browser
```

### Kenapa browser tidak melihat `@extends`

Browser tidak mengerti sintaks Blade.

Browser hanya mengerti hasil akhirnya.

Jadi saat halaman sudah tampil, browser tidak pernah menerima teks seperti:

```php
@extends('layouts.app')
```

atau:

```php
@include('layouts.navbar')
```

Yang diterima browser hanyalah HTML yang sudah jadi.

### Di mana hasil Blade diproses

Blade diproses di sisi server.

Laravel mengubah file Blade menjadi bentuk yang siap dijalankan sebelum hasil akhirnya dikirim ke browser.

Karena itu:

* Anda menulis file yang rapi di `resources/views`
* Laravel menyiapkan hasil akhirnya di belakang layar
* browser hanya menampilkan hasil gabungannya

### Melihat hasil kompilasi Blade

Kalau ingin melihat prosesnya lebih dekat, Anda bisa membuka folder berikut:

```
storage/framework/views
```

Di sana biasanya ada file hasil kompilasi dengan nama acak.

File itu menunjukkan bahwa Blade sudah diubah menjadi bentuk yang siap dijalankan server.

Anda tidak perlu mengedit file di folder itu.

Folder tersebut hanya membantu Anda memahami apa yang terjadi di belakang layar.

{% hint style="info" %}
Folder `storage/framework/views` adalah cache hasil kompilasi view. Laravel memakainya agar render halaman lebih cepat.
{% endhint %}

### Kenapa konsep ini penting

Jika paham alur layout, Anda akan lebih mudah:

* melacak kenapa isi halaman tidak muncul
* membedakan masalah layout dan masalah route
* memahami kenapa satu perubahan bisa memengaruhi banyak halaman

Contohnya:

* jika navbar rusak, semua halaman yang meng-`include` navbar ikut terdampak
* jika nama `@yield` dan `@section` tidak cocok, bagian konten bisa kosong

### Jika perubahan Blade tidak muncul

Kadang Anda sudah mengubah file Blade, tetapi browser masih menampilkan hasil lama.

Biasanya cukup lakukan ini:

1. simpan file dengan `Ctrl + S`
2. refresh browser
3. jika masih sama, jalankan:

```bash
php artisan view:clear
```

Perintah itu membersihkan cache view agar Laravel merakit ulang tampilannya.

{% hint style="warning" %}
Gunakan `php artisan view:clear` saat perubahan Blade terasa tidak ikut terbarui. Jangan langsung mengira route atau server rusak.
{% endhint %}

### Poin evaluasi bab 3.4

Pastikan Anda sudah memahami poin berikut:

* Saya paham halaman Blade digabung dulu sebelum dikirim ke browser.
* Saya tahu peran `@extends`, `@section`, `@yield`, dan `@include`.
* Saya paham browser hanya menerima HTML hasil akhir.
* Saya tahu hasil kompilasi Blade bisa ditemukan di `storage/framework/views`.
* Saya tahu file di folder cache tidak perlu diedit manual.
* Saya tahu `php artisan view:clear` dipakai saat cache view perlu dibersihkan.

Jika semua sudah jelas, lanjut ke [3.5 Tantangan: Membuat Halaman About](/laravel/bab-3-blade-templating/3.5-tantangan-membuat-halaman-about.md).


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://learn.devlabss.my.id/laravel/bab-3-blade-templating/3.4-penjelasan-alur-kerja-layout.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.