Build a Realtime Chat with Laravel, Vue and Pinia

Using the power of Reverb, let’s build a realtime multi-room chat with Laravel and Vue with Inertia, pulling in Pinia for state management.

We’ll cover:

• Using the Intersection Observer API to automatically load previous chat messages
• State management with Pinia
• Using presence channels to show online users for each room
• Client-to client communication to show who’s typing
• Using flexbox tricks to keep messages scrolled into view as they roll in