Philo Hermans :: Reusing Reusable Livewire Components
summary
A working modal system built with Livewire v3 and Alpine.js shows reusable UI pieces passed around as a PHP Artisan make:livewire component, opened via dispatched events like model.open, and kept in sync with entangled state using entangle. Components render dynamically with <x-dynamic-component>, support lazy placeholder loading (demo sleeps 3s to show it), and emit events to update other components. A component library (wire elements) and a cloud editor (wireboox) exist; production use handles thousands of users for about €10/month.
AI-written summary · about
chapters (16)
- 0:00Introduction
- 1:02Why I built my own platform
- 2:26Livewire and Alpine JS
- 3:30Reusable Livewire components
- 4:13Dynamic login modal
- 8:47Passing modal arguments
- 10:12Frontend and backend state
- 13:20Dynamic component rendering
- 14:48Form validation in Livewire
- 16:13Hide modal on success
- 17:38UI updates on login
- 18:20Lazy loading components
- 20:27Modal custom directives
- 22:13Advanced Livewire features
- 23:39Introducing Wirebox
- 25:10Q&A
