Tanggal :21 September 2023
Apa itu Livewire

Apa Itu Laravel Livewire ?

Artikel ini bagian ke 1 dari total 8 artikel di seri Belajar Laravel Livewire

Assalamualaikum Warohmatulloh Wabarokatuh, mungkin saya agak terlambat menyadari tentang Laravel Livewire. Padahal di Twitter saya mengikuti akun @calebporzio pembuat Livewire dan tidak jarang dia berbagi tentang Livewire ini. Jadi karena sering melihat tweet tentang Livewire akhirnya saya penasaran tentang Livewire ini dan melakukan sedikit percobaan dengan Livewire? Dan apa kesan pertama saya? COOL!!! kita bisa membuat web modern dengan tetap merasakan kenyamanan dari Laravel.

Jadi sebenarnya apa itu Laravel Livewire? Livewire adalah full-stack framework untuk Laravel, yang memungkinkan kita membuat antar muka dinamis secara mudah, tanpa meninggalkan kenyamanan Laravel atau maksudnya gaya kodingnya masih Laravel banget.

Setelah saya mencoba sedikit, saya bisa menyimpulkan seperti ini, jika biasanya kita menggunakan frontend framework semisal Vuejs atau React, kita biasanya membutuhkan API untuk mengambil data dan menampilkan data.

Sedangkan Laravel Livewire ini tidak seperti itu, Livewire membuat 2 file ketika kita membuat component Livewire, file pertama adalah file Class PHP yang bekerja mirip dengan controller di Laravel, dan yang kedua adalah file view, proses menampilkan data di Livewire sama persis dengan cara kita biasanya menampilkan data dari controller ke view di Laravel.

Kalau menurut halaman awal webnya, Livewire kurang lebih seperti ini cara kerjanya.

  • Livewire merender component awal dengan sebuah halaman ( seperti Blade @include), dengan cara ini jadi SEO friendly.
  • Ketika terjadi interaksi, Livewire membuat AJAX request dengan data terbaru.
  • Server merender ulang component dan merespons dengan HTML yang baru.
  • Kemudian secara pintar Livewire memutasi DOM sesuai hal – hal yang berubah.

Livewire hanya mengandalkan AJAX request untuk melakukan semua komunikasi servernya dan tidak menggunakan websockets.

Sedikit rumit jika dijelaskan dengan kata – kata, tapi kurang lebih seperti itu, mungkin kawan kawan akan paham, ketika praktik dengan kode, segitu dulu tentang Laravel Livewire, kita mulai praktek dengan Menginstal Livewire.

Wassalamualaikum Warohmatulloh Wabarokatuh.

Series NavigationBelajar Laravel Livewire : Menginstal Laravel Livewire >>

Hai semua, saya Amirul seorang Software Engineer, suka membuat konten pembelajaran berupa artikel, video tutorial maupun podcast

9 Comments

  1. Riyan permadi Reply

    Kawan koding buat trik san tips
    dengan Livewire yg biasanya di buat dengan js atau vuejs tp d buat dengan Livewire, sebagai contoh buat form dinamis dengan tombol tambah, maka akan menambah form input setiap klick button , atau combine Livewire dengan trit party seperti select2 atau date botraps , semoga bisa jd dan saya menunggu itu eheh terimakasi artikel nya bagus

  2. Erik Maulana Reply

    livewire ini terinspirasi dari phoenix live view ya, sayangnya livewire ini komunikasi ke server nya pake ajax, kalo phoenix live view pake websokcet

  3. Dimas Nugroho Reply

    Emang kenapa kalo pake ajax dan gak pake websocket? Apakah ada perbedaan kecepatan request atau gimana ya mas?

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *