Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Dashboard (Algolia)

Dashboard (Algolia)

Freek Van der Herten

September 07, 2017
Tweet

More Decks by Freek Van der Herten

Other Decks in Programming

Transcript

  1. Creating a dashboard
    using Laravel ,
    Vue and Pusher

    View full-size slide

  2. About me
    Freek Van der Herten
    Partner & developer at SPATIE
    @freekmurze
    https://murze.be

    View full-size slide

  3. Since 2003
    Websites, applications and webshops
    Team
    4 developers, 1 manager
    Specialization
    Laravel development

    View full-size slide

  4. OPEN SOURCE SOFTWARE

    View full-size slide

  5. https://spatie.be/en/opensource/laravel

    View full-size slide

  6. Open source software
    ± 160 public repositories on GitHub
    August 2016: ± 800 000 downloads
    August 2017: ± 5 000 000 downloads
    ± 500 000 downloads a month
    A lot of benefits: learning, writing quality documentation and
    tests, showing the quality of our work, eating our own dogfood

    View full-size slide

  7. http://github-awards.com/users?type=world&language=php
    Open source software

    View full-size slide

  8. WE ❤ POSTCARDS

    View full-size slide

  9. Spatie

    Samberstraat 69D
    2060 Antwerp

    Belgium

    View full-size slide

  10. https://github.com/spatie/dashboard.spatie.be

    View full-size slide

  11. HIGH LEVEL OVERVIEW

    View full-size slide

  12. The dashboard is a single HTML page
    Displayed by a full screen browser
    Without full page reload
    Each tile wil be updated by JavaScript
    Each tile has it’s own update frequency
    In short

    View full-size slide

  13. Grid system
    The Packagist tile
    The Twitter tile
    Topics

    View full-size slide

  14. There will be 

    some live coding
    We’ll use 

    an internet connection

    View full-size slide

  15. DISPLAYING ON A TV

    View full-size slide

  16. Raspberry Pi 2

    View full-size slide

  17. Raspberry Pi 2
    Powered by the USB port from the TV
    Uses Raspbian Jessie
    Boots into Chromium 56 in fullscreen mode
    Setup

    View full-size slide

  18. TRY IT OUT YOURSELF

    View full-size slide

  19. Source code
    https://github.com/spatie/dashboard.spatie.be
    Blog post
    https://murze.be/2017/06/building-realtime-dashboard-powered-
    laravel-vue-2017-edition/
    Documentation

    View full-size slide

  20. Thank you!
    https://speakerdeck.com/freekmurze/dashboard-algolia
    https://spatie.be/opensource/laravel
    https://murze.be
    https://murze.be/newsletter

    View full-size slide