Eksplorasi SPA Blade dengan Splade

Hari-hari ini improvisasi dalam laravel makin gila-gilaan. Laracon kemarin adalah salah satu ajang untuk memetakan apa sih yang laravel bisa hasilkan hari ini? Mulai dari phpNative, livewire, sampai Splade.

Splade itu apa? Splade adalah laravel berbasis blade namun seolah adalah SPA. Dikutip dari website resmi splade.dev dikatakan bahwa, “Splade provides a super easy way to build Single Page Applications (SPA) using standard Laravel Blade templates, enhanced with renderless Vue 3 components. In essence, you can write your app using the simplicity of Blade, and besides that magic SPA-feeling, you can sparkle it to make it interactive. All without ever leaving Blade.”

Bagaimana cara instalasi splade di laravel sih? Gampang. Pertama-tama, tentu aja harus udah install Laravel nya dulu. Setelah laravel terinstall, tambahin package spladenya. Caranya?

composer require protonemedia/laravel-splade //nenambahkan requirement di composer
 
php artisan splade:install //instalasi splade

Paket splade ini menyediakan perintah Artisan yang nyaman, yang menginstal Tailwind CSS 3.0 dan Vue 3.0 di frontend. Di backend, menginstal Route Middleware, Exception Handler, dan menyiapkan tampilan default dan rutenya.

Perintah splade:install juga akan membangun aset frontend. Sama seperti aplikasi Laravel biasa, Anda dapat menjalankan server pengembangan Vite:

npm run dev

Splade juga telah terintegrasi dengan Laravel Breeze sehingga dimungkinkan menginstall laravel breeze hanya dengan menjalakan perintah sebagai berikut:

composer require protonemedia/laravel-splade-breeze

php artisan breeze:install

Dalam mengeksplorasi Splade ini, saya mencoba membuat project sederhana dengan memanfaatkan API Publik dari Gading.dev. Projek percobaan ini dapat diakses pada laman quran.azharazziz.my.id. Untuk kode sumber dapat di akses pada laman github.