Building a realtime dashboard with Laravel Livewire (PHPKonf)

Transcript

1. Building a real time dashboard with Laravel & Livewire

2. About me Freek Van der Herten Partner & developer at

   SPATIE @freekmurze freek.dev spatie.be/prodcuts ohdear.app f l areapp.io

3. Open source ± 300 packages on Packagist ± 105 000

   000 downloads total ± 5 500 000 downloads a month

4. https://spatie.be/open-source

5. https://spatie.be/open-source

6. Our dashboard

7. None
8. None
9. None
10. None
11. None
12. None

13. Introducing Laravel Dashboard

14. Laravel Dashboard A free open source package Takes care of

    positioning of tiles, and state Tiles themselves are separate packages Livewire components

15. Livewire Made by Caleb Porzio Server rendered partials No /

    minimal JavaScript knowledge necessary Refresh through polling laravel-livewire.com

16. Demo

17. Comparing WebSockets/Vue to Livewire

18. Our previous dashboard WebSockets to transmit new data Tiles rendered

    with Vue A single Laravel app

19. WebSockets/Vue + realtime + no meaningful extra load when connecting

    client - tech stack more complicated, WebSockets server needed - potentially display old data - build proces

20. Livewire + simple tech stack, just an app and a

    db + easy to package up tiles, only PHP knowledge needed + up to date from f i rst render - not realtime, but close - load on server increases with every user - Livewire isn’t an industry standard like WebSockets/Vue (yet)

21. In closing

22. Laravel Dashboard Easy to use package Set up a dashboard

    in no time Extensive documentation docs.spatie.be/laravel-dashboard

23. One more thing…

24. spatie.be/videos/laravel-package-training

25. Laravel Package Training Learn to build framework agnostic PHP /

    Laravel packages Best practices GitHub Actions Package source dives 4 hours of quality content

26. Discount spatie.be/products?referrer=phpkonf 20% discount

27. Thank you! freek.dev @freekmurze