Daftar dan Belajar Sekarang!

Laravel Vue Chat App

Membuat aplikasi chat dengan laravel, vue dan juga pusher sebagai teknologi realtimenya. Kita akan kenalan juga sama laravel echo disini

Poin: 100 EXP

❱ Persiapan

Laravel Chat App persiapan pusher laravel locked icon model dan migrasi message locked icon

❱ Vuejs Component

component chat locked icon menampilkan chat dari database locked icon mengirim chat locked icon memperbaiki ux chat locked icon

❱ Saatnya Realtime

realtime chat locked icon user sedang online locked icon menangani error locked icon download icon

Detail Kelas

Laravel Chat App

Trailer dari kelas membuat aplikasi chat dengan laravel


persiapan pusher laravel

Kita siapin dulu aplikasi pusher yang akan menjadi teknologi realtime pada aplikasi chat ini


model dan migrasi message

Sekarang kita siapkan model dan juga relasi dari message kepada user. Table ini akan menyimpan data-data chat pada public chat ini


component chat

Pindah ke vuejs, kali ini kita buat component chat secara terpisah, ada untuk menangani form, list user dan daftar chatnya


menampilkan chat dari database

Menampilkan chat dari database ke view user melalui komponen vuejs yang sudah dibuat. Untuk datanya kita akan pake modelfactory dibantu dengan aritsan tinker


mengirim chat

Saatnya kita ngirim chat dari component form yang sudah dibuat, dan menampilkan datanya langsung pada daftar chat di bagian atas


memperbaiki ux chat

Ada banyak yang bisa diimprove dari sisi ux (user experience) aplikasi chat kita, lihat yuk apa aja


realtime chat

Yang ditunggu-tunggu! saatnya implementasikan teknologi realtime pada aplikasi chat ini. Menggabungkan laravel echo, event dan juga pusher


user sedang online

Tampilkan daftar user yang sedang online, begitu juga ketika usernya memutuskan untuk offline namanya akan automatis keluar dari daftar chat


menangani error

Bagaimana jika ada error pada saat mengirim chat dari sisi backend, saatnya kita tangani masalah ini


Laravel Vue Chat App

time icon 2 tahun yang lalu
level icon Sulit