Skip to content
Show
Laravel View dan Blade (Belajar Laravel #5)
Laravel View dan Blade (Belajar Laravel #5)Laravel View dan Blade merupakan salah fitur dari Laravel yang memudahkan pengembang web untuk memisahkan tampilan dengan logic. Artikel ini akan membahas tentang View dan pemanfaatan Blade, sebuah fitur Laravel untuk memudahkan dalam menampikan data maupun informasi pada halaman web. Penjelasan Laravel View dan BladeViews adalah representasi visual dari suatu halaman web yang pada umumnya bertugas untuk menampilkan data yang diterima oleh Controller dari Model. Dalam hal ini Views adalah bagian dari sistem Laravel di mana HTML dihasilkan dan kemudian ditampilkan di layar pengguna. Penggunaan Views sangat membantu pengembangan web khususnya untuk merawat dan memberikan tambahan fungsi, karena memisahkan logic atau program utama dengan bagian tampilan. Blade adalah fitur yang disediakan Laravel untuk proses templating sederhana namun sangat bermanfaat dalam proses pengembangan tampilan halaman web. Tidak seperti fitur templating PHP populer lainnya, Blade tidak membatasi pemrogram untuk menggunakan kode PHP biasa dalam membuat kode untuk tampilan. Semua tampilan Blade dikompilasi ke dalam kode PHP biasa dan kemudian disimpan dalam cache hingga diubah, yang berarti Blade pada dasarnya tidak menambahkan beban atau overhead pada saat aplikasi dijalankan. File tampilan blade menggunakan ekstensi file .blade.php dan biasanya disimpan di direktori resources / views. Dalam hal ini Blade pada Laravel menggunakan basis template inheritance dan sections. Salah satu fungsi dari Laravel Blade templating adalah penggunaan layout, agar tampilan yang berulang misalnya header, footer, sidebar dan sebagainya tidak perlu dibuat berkali-kali sehingga rawan inkonsistensi. Pada umumnya layout ditempatkan dalam sebuah folder yang bernama layout dalam folder views, namun demikian programmer tidak dibatasi apabila ingin menggunakan nama lain. Tutorial Halaman Web dengan Laravel View dan BladePada tutorial ini akan dibuat tampilan dari halaman web dengan memanfaatkan CSS dan framework CSS Boostrap agar menghasilkan tampilan yang lebih professional. Menggunakan Template di ViewBuat sebuah file home.blade.php dan letakkan dalam folder view. Pada file ini akan dibuat sebuah halaman sederhana, dengan memanfaatkan bootstrap. Misalnya dengan menggunakan Jumbotron pada contoh ini: https://getbootstrap.com/docs/4.2/components/jumbotron/ Bootstrap Jumbotron Silahkan salin code Jumbotron dan sisipkan dalam View, seperti terlihat di gambar berikut ini: Jumbotron Code Memanfaatkan Parameter ConfigIkuti langkat berikut untuk melakukan konfigurasi sistem pada Laravel:
Dengan parameter ke-2 sebagai default value: Code yang dibuat akan terlihat seperti gambar berikut ini: .env App Name Berikut adalah tampilan yang dihasilkan: Tampilan halaman dengan App Name Penggunaan Bootstrap
Tampilan Home dengan Bootstrap CSS Apabila dicermati, maka kode sumber dari halaman ini akan tampil sebagai berikut: Source Code View dengan Jumbotron Mendefinisikan BladePotongan program berikut dalam file app.blade.php yang disimpan dalam sebuah folder baru dalam folders Views yang diberi nama Layouts. Berikut adalah penjelasan dari potongan program tersebut:
Menggunakan BladeBerikut adalah contoh penggunaan Blade Template: Berikut adalah penjelasan dari potongan program tersebut:
Jadi manakah yang sebaiknya dipergunakan, Yield atau Section?
Menampilkan BladeBlade views yang telah dibuat dapat ditampilkan dengan perintah view yang dapat diakses secara global. Layout
Folder Layout Dalam Views Isi File app.blade.php Silahkan mengganti bagian isi dari container dengan code menggunakan @yield seperti tampak pada gambar berikut: File App dengan menggunakan @yield Silahkan mengubah isi dari home.blade.php dengan kode seperti terlihat pada gambar: Extends Blade Mengirimkan Value ke BladeBerikut adalah beberapa cara untuk mengirimkan Value ke Blade:
Menerima Multi Value dari BladeBerikut adalah potongan program yang dipergunakan untuk mengambil muti value yang dikirimkan menggunakan Blade. Mendapatkan Multi Value dengan Blade LatihanSilahkan mengerjakan view untuk halaman website portfolio yang terdiri dari halaman:
Silahkan mengubah berbagai view yang ada pada project dengan memanfaatkan fitur Blade Templating.
Written by: SEW 20190922TerkaitShare This Story, Choose Your Platform!About the Author: SEW
Stephanus Eko Wahyudi adalah dosen Teknik Informatika Universitas Ciputra yang juga bertugas menjadi Head of Department (Kaprodi) di departemen yang sama. Pendidikan sarjana ditempuhnya di bidang Teknik Informatika, sedangkan pasca-sarjana sebagai Master of Multimedia di Monash University Melbourne. Adapun bidang minat riset dan pengembangan adalah di bidang teknologi web based applications, mobile applications, multimedia applications, serta technopreneurship. Saat ini menempuh S3 di bidang Manajemen Teknologi Informasi di Institut Teknologi Sepuluh Nopember (ITS) Surabaya. Related Posts2 Comments
|