Building a dashboard using Laravel, Vue.js and Pusher
Build a dashboard using Laravel and Vue
You’ll need to be familiar with both Laravel and Vue to get the most out of this post
At Spatie they decided to rebuild their dashboard, after support for Dashing has officially stopped.The new version is built with Laravel 5.3, Vue and Pusher.
At first, it explains how the grid system they used, works. Then an info for the internet status (up or down) is explained, "The internet connection component", and details about the Server side and Client side of it. Another component feature is "The Package statistics component", which is statistics displayed regarding how many times their packages get downloaded. After that is "Security" because sensitive info is displayed and they wanted to secure it.
Also the made their code open available here.
Packages used
The dashboard is fetching data from various sources: Google Calendar, Packagist, Lastfm,… Here’s the list of packages used to pull in the data:
- spatie/last-fm-now-playing: Get info on a track that user is currently playing
- spatie/laravel-google-calendar: The easiest way the not only read but also write to a Google Calendar via PHP.
- graham-campbell/github: read data from GitHub.
- spatie/packagist-api: fetch statistics on PHP Packages.
- l5-very-basic-auth: a basic auth filter to protect routes.
To see all these in detail and action read the whole thing.
