Mengenal Blade Template pada Laravel
Blade merupakan template engine bawaan Laravel. bisa dilihat juga pada file-file views semuanya berakhiran dengan .blade.php . blade template ini digunakan untuk lebih menyederhanakan file-file views pada aplikasi.
kali ini akan digunakan untuk membuat halaman web sederhana, dimana app.blade.php sebagai master page. struktur filenya seperti berikut ini:
-app.blade.php --about.blade.php --contact.blade.php
pertama membuat file app.blade.php sebagai master page.
@yield('') digunakan sebagai tanda dimana akan menempatkan bagian-bagian dari halaman website. bisa dilihat pada gambar diatas menggunakan 2 @yield, satu digunakan sebagai judul dengan tanda @yield('title') dan yang kedua tanda @yield('content') untuk tempat dari konten yang akan ditampilkan.
sekarang membuat halaman about. pada bagian ini tentu tidak perlu membuat dari nol, karena sebelumnya telah didefinisikan pada master page yaitu app.blade.php.
penjelasannya dimulai dari @extends('app') merupakan pewarisan dari master page yaitu app.blade.php dan di master page terdapat 2 bagian @yield('') yaitu title dan content. nah,, bagian itu sekarang dijabarkan pada about.blade.php dengan @section(''). section ini digunakan sebagai penanda dari yield pada master page. dan jika dilihat di browser.
jika dilihat page source-nya.
bisa dipahami sekilas blade template ini membuat kode lebih sedikit. jadi tidak perlu setiap halaman membuat HTML baru dengan attribut css misalnya. cukup ditaruh pada master page.
setelah halaman about, sekarang membuat halaman contact. sama seperti membuat halaman about, contact tinggal membuat section dari masing-masing @yield('') pada master page.
setelah halaman about, sekarang membuat halaman contact. sama seperti membuat halaman about, contact tinggal membuat section dari masing-masing @yield('') pada master page.
dan jika dilihat di browser hasilnya juga sama.
dengan blade template juga bisa @include. misal menambahkan navigation header. file views ini diletakkan pada folder tersendiri misalnya.
sekarang header bisa di-include ke dalam master page. seperti gambar dibawah ini, file header berada di folder include sehinggan syntaxnya menjadi @include('include.header')
hasilnya header sudah terpasang pada halaman master page.
referensi
Langganan:
Posting Komentar
(
Atom
)
thanks gan sudah share
BalasHapusObeng samsung plus ori