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
810
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
200
I shall define this only once
freekmurze
0
410
An Introduction to Snapshot testing
freekmurze
0
500
Event Sourcing In Laravel
freekmurze
0
250
A tour behind the scenes of Oh Dear (PHP Benelux)
freekmurze
2
850
A practical look at multitenancy in Laravel
freekmurze
1
350
A practical look at multitenancy in Laravel (Laracon US)
freekmurze
0
730
Highlights Flare codebase (Laracon online)
freekmurze
0
510
Introducing Mailcoach
freekmurze
1
620
Other Decks in Programming
See All in Programming
状態遷移図を書こう / Sequence Chart vs State Diagram
orgachem
PRO
3
250
QA x AIエコシステム段階構築作戦
osu
0
140
11年かかって やっとVibe Codingに 時代が追いつきましたね
yimajo
0
150
Vibe Codingの幻想を超えて-生成AIを現場で使えるようにするまでの泥臭い話.ai
fumiyakume
18
9.2k
NEWT Backend Evolution
xpromx
1
150
「次に何を学べばいいか分からない」あなたへ──若手エンジニアのための学習地図
panda_program
3
640
Yes, You Can Work on Rails & any other Gem
kaspth
0
110
AIコーディングエージェント全社導入とセキュリティ対策
hikaruegashira
11
7.2k
MCPで実現できる、Webサービス利用体験について
syumai
6
1.8k
効率的な開発手段として VRTを活用する
ishkawa
1
180
「テストは愚直&&網羅的に書くほどよい」という誤解 / Test Smarter, Not Harder
munetoshi
1
220
新メンバーも今日から大活躍!SREが支えるスケールし続ける組織のオンボーディング
honmarkhunt
5
9.3k
Featured
See All Featured
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
21
1.3k
Being A Developer After 40
akosma
90
590k
Building an army of robots
kneath
306
45k
Why Our Code Smells
bkeepers
PRO
337
57k
A Tale of Four Properties
chriscoyier
160
23k
Art, The Web, and Tiny UX
lynnandtonic
301
21k
The Language of Interfaces
destraynor
158
25k
Typedesign – Prime Four
hannesfritz
42
2.7k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
138
34k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Embracing the Ebb and Flow
colly
86
4.8k
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