Building a Realtime Chat App with Vue.js and Laravel
New tutorial series, which consists of five main steps, all explained through videos. The goal is a real time chat application in a project made with Vue.js, Laravel 5.4 and Laravel Dusk. Each step consists of a video and the code for it.
Step 1: In the first video of the series, the development version of Laravel is installed, and the new Laravel Mix is up and running, with rendering and Vue component example.
Step 2 Video: Vue Components
Start developing several Vue Components to create an interactive chat application.
Step 3 Video: Laravel Backend
POST chat messages to the server and start loading messages from the server. It’s basic Laravel models and routes in this video.
Step 4 Video: Laravel Echo
Chat app is connected to the server, but a refresh is required to see new messages from other people. This step involves setting up Event Broadcasting within Laravel and implementing Laravel Echo on the front end using Pusher.
Step 5 Video: Laravel Dusk
Testing the realtime chat application. Installation of Laravel Dusk, example tests, and the benefits of this sort of testing environment.