eessex / apr-dashboard

APRd (Artsy Real-time Dashboard)

APRd (aka. APR dashboard), is a real-time dashboard built in Elixir on Phoenix Framework. For it's real-time dashboard it's using Phoenix Live View to be able to provide websocket based pages that can update in real-time based on updates on the server side.

Meta

• State: production
• Production: https://aprd.artsy.net/dashboard
• Staging: https://aprd-staging.artsy.net/dashboard
• GitHub: https://github.com/artsy/apr-dashboard/
• CI: CircleCI; merged PRs to artsy/apr-dashboard#master are automatically deployed to staging. PRs from staging to release are automatically deployed to production. Start a deploy...
• Point People: @ashkan18, @zephraph

Setup

• Fork the project to your GitHub account

• Clone your fork:

  $ git clone [e-mail]:your-github-username/apr-dashboard.git
  

• Install dependencies with mix deps.get

• Create and migrate your database with mix ecto.setup

• Install Node.js dependencies with cd assets && npm install

• Copy .env.example to .env

• We use Phoenix Live View for our real-time data presentation. Make sure to set SECRET_SALT in your .env. Generate a secret salt with:

  • mix phx.gen.secret 32

• Make set your RabbitMQ setting in .env

• Start Phoenix endpoint with mix phx.server

Now you can visit localhost:4000/dashboard from your browser.

Architecture

APRd listens on RabbitMQ for different topics. Once it receives a new event, it will store a copy of that event locally in it's database so we can later process the data and provide detailed and aggregated data.

Whenever we receive a new event, after storing the event locally, we use Phoenix's local PUB/SUB to broadcast we received an event. And then our websocket live views are listening on this internal PUB/SUB and they update the data on listening Webosckets reflecting the latest event updated.