Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Building a realtime dashboard with Laravel Livewire (PHPKonf)
Search
Freek Van der Herten
December 12, 2020
Programming
0
690
Building a realtime dashboard with Laravel Livewire (PHPKonf)
Freek Van der Herten
December 12, 2020
Tweet
Share
More Decks by Freek Van der Herten
See All by Freek Van der Herten
I shall define this only once
freekmurze
0
340
An Introduction to Snapshot testing
freekmurze
0
390
Event Sourcing In Laravel
freekmurze
0
200
A tour behind the scenes of Oh Dear (PHP Benelux)
freekmurze
2
730
A practical look at multitenancy in Laravel
freekmurze
1
290
A practical look at multitenancy in Laravel (Laracon US)
freekmurze
0
640
Highlights Flare codebase (Laracon online)
freekmurze
0
370
Introducing Mailcoach
freekmurze
1
550
Highlights from the Flare codebase (Full Stack Ghent)
freekmurze
0
590
Other Decks in Programming
See All in Programming
SDCon2024: Enabling DevOps and Team Topologies thru architecture: architecting for fast flow
cer
PRO
0
780
「2024年版 Kotlin サーバーサイドプログラミング実践開発」の補講 〜O/Rマッパー編〜
n_takehata
2
260
Harnessing Large Language Models for Training-free Video Anomaly Detection
tereka114
1
1.3k
Temporalを取り巻く仕様を整理する
sajikix
0
110
Namespace on read
tagomoris
2
370
ドメイン駆動設計の実践
masuda220
PRO
17
5.1k
継続的な活動で築く地方エンジニアの道
myamashii
2
350
大規模マルチテナントを解決するYugabyteDBという選択肢
nnaka2992
1
250
Clean Architecture by TypeScript & NestJS
ryounasso
0
150
日付と正規化
megmogmog1965
0
140
AWS CDKにおける「再利用性」を考える / aws-cdk-reusability
gotok365
6
1.3k
実用的かつリーズナブルな 「Azure × Gemini × LINE」~キャラクターBot 実装ライブデモ~
tomodo_ysys
1
170
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
784
250k
Building an army of robots
kneath
301
42k
Principles of Awesome APIs and How to Build Them.
keavy
124
16k
Practical Orchestrator
shlominoach
185
10k
Scaling GitHub
holman
458
140k
What's in a price? How to price your products and services
michaelherold
239
11k
Rebuilding a faster, lazier Slack
samanthasiow
78
8.5k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
Design by the Numbers
sachag
277
18k
YesSQL, Process and Tooling at Scale
rocio
166
14k
How to Think Like a Performance Engineer
csswizardry
4
590
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
16
1.6k
Transcript
Building a real time dashboard with Laravel & Livewire
About me Freek Van der Herten Partner & developer at
SPATIE @freekmurze freek.dev spatie.be/prodcuts ohdear.app f l areapp.io
Open source ± 300 packages on Packagist ± 105 000
000 downloads total ± 5 500 000 downloads a month
https://spatie.be/open-source
https://spatie.be/open-source
Our dashboard
None
None
None
None
None
None
Introducing Laravel Dashboard
Laravel Dashboard A free open source package Takes care of
positioning of tiles, and state Tiles themselves are separate packages Livewire components
Livewire Made by Caleb Porzio Server rendered partials No /
minimal JavaScript knowledge necessary Refresh through polling laravel-livewire.com
Demo
Comparing WebSockets/Vue to Livewire
Our previous dashboard WebSockets to transmit new data Tiles rendered
with Vue A single Laravel app
WebSockets/Vue + realtime + no meaningful extra load when connecting
client - tech stack more complicated, WebSockets server needed - potentially display old data - build proces
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)
In closing
Laravel Dashboard Easy to use package Set up a dashboard
in no time Extensive documentation docs.spatie.be/laravel-dashboard
One more thing…
spatie.be/videos/laravel-package-training
Laravel Package Training Learn to build framework agnostic PHP /
Laravel packages Best practices GitHub Actions Package source dives 4 hours of quality content
Discount spatie.be/products?referrer=phpkonf 20% discount
Thank you! freek.dev @freekmurze