Halo teman-teman semuanya, pada kesempatan kali ini kita akan belajar untuk menginstall Turbolinks di dalam project laravel Livewire kita. Turbolinks di gunakan untuk membuat project kita menjadi SPA (Single Page Application) atau berpindah-pindah halaman tanpa harus melakukan sebuah reload page. Dan untuk Installasi dan konfigurasi di dalam Livewire ini sangat mudah dan simple sekali, langsung saja kita mulai.
Langkah 1 - Installasi Node Js
Pastikan teman-teman sudah menginstall Node Js terlebih dahulu, karena kita nanti akan menggunakan NPM atau Node Package Manager dri Node Js untuk mengunduh dependensi Turbolinks dari repository.
Untuk installasi Node Js, silahkan bisa mengunjungi situs resminya di https://nodejs.org/en/download/ dan silahkan disesuaikan dengan sistem operasinya masing-masing.
Untuk mengetahui apakah komputer kita sudah terinstall Node Js dan NPM, kita bisa mencoba menjalankan perintah di bawah ini di dalam CMD atau terminal.
node -v
npm -v
Jika perintah di atas keluar versi dari Node Js dan NPM, maka kita sudah berhasil menginstall Node Jd di dalam komputer kita.
Langkah 2 - Installasi Turbolinks
Silahkan masuk ke dalam folder project kita dan jalankan perintah di bawah ini :
npm install
npm install turbolinks
Silahkan di tunggu proses installasinya sampai selesai, dan pastikan harus terhubung dengan internet, karena semua dependensi akan diunduh secara online.
Langkah 3 - Konfigurasi Turbolinks
Setelah proses installasi Turbolinks selesai, sekarang kita lanjutkan untuk konfigurasi Turbolinks di dalam project kita. Silahkan buka file resources/js/app.js kemudian tambahkan kode berikut ini :
var Turbolinks = require("turbolinks")
Turbolinks.start()
Setelah itu kita akan lakukan compiling file app.js menggunakan Laravel MIX, silahkan jalankan perintah di bawah ini :
npm run dev
Silahkan di tunggu proses bundling atau coompiling dari semua file JavaScript di dalam project Laravel kita. Kemudian untuk menggunkan kita bisa panggil file app.js di dalam layouts project kita.
Jika kita perhatikan di dalam file resources/layouts/app.blade.php kita sudah menambahkan file app.js, kurang lebih sintaksnya seperti berikut ini :
<script src="{{ mix('js/app.js') }}"></script>
Artinya sekarang project kita sudah terintegrasi dengan Turbolinks dan kita bisa membuat project kita menjadi SPA atau Single Page Application.
EBOOK MEMBANGUN TOKO ONLINE DENGAN LARAVEL DAN LIVEWIRE : https://bit.ly/ebook-laravel-livewire