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 Live...
Search
Freek Van der Herten
December 12, 2020
Programming
0
760
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
Uncharted packages (Laravel Live Denmark)
freekmurze
0
180
I shall define this only once
freekmurze
0
380
An Introduction to Snapshot testing
freekmurze
0
460
Event Sourcing In Laravel
freekmurze
0
230
A tour behind the scenes of Oh Dear (PHP Benelux)
freekmurze
2
820
A practical look at multitenancy in Laravel
freekmurze
1
330
A practical look at multitenancy in Laravel (Laracon US)
freekmurze
0
700
Highlights Flare codebase (Laracon online)
freekmurze
0
460
Introducing Mailcoach
freekmurze
1
600
Other Decks in Programming
See All in Programming
5分で理解する SOLID 原則 #phpcon_nagoya
shogogg
1
270
DROBEの生成AI活用事例 with AWS
ippey
0
140
Pulsar2 を雰囲気で使ってみよう
anoken
0
240
仕様変更に耐えるための"今の"DRY原則を考える
mkmk884
8
2.6k
JavaScriptツール群「UnJS」を5分で一気に駆け巡る!
k1tikurisu
9
1.8k
『品質』という言葉が嫌いな理由
korimu
0
180
お前もAI鬼にならないか?👹Bolt & Cursor & Supabase & Vercelで人間をやめるぞ、ジョジョー!👺
taishiyade
7
4.1k
コミュニティ駆動 AWS CDK ライブラリ「Open Constructs Library」 / community-cdk-library
gotok365
2
180
Honoのおもしろいミドルウェアをみてみよう
yusukebe
1
210
負債になりにくいCSSをデザイナとつくるには?
fsubal
10
2.5k
WebDriver BiDiとは何なのか
yotahada3
1
150
『GO』アプリ バックエンドサーバのコスト削減
mot_techtalk
0
150
Featured
See All Featured
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
114
50k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
30
4.6k
Building Applications with DynamoDB
mza
93
6.2k
RailsConf 2023
tenderlove
29
1k
YesSQL, Process and Tooling at Scale
rocio
172
14k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
GitHub's CSS Performance
jonrohan
1030
460k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.1k
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