CI Dashboard

Tech Stack: TypeScript, JavaScript, NodeJS, MySQL, Google Cloud

View Demo Video (1 minute and 52 seconds)

View Source (GitHub)

This web app visualizes continuous integration performance metrics with simple moving averages to aid the optimization of project development processes.

Avatar

The app is designed with three main goals/requirements:

  1. runs on an always-on TV screen in the office
  2. easily spot trends and anomalies from visualizations
  3. easily add a new custom visualization or a new data source

Avatar

For the office TV, the app automatically cycles through each category and reloads visualizations as new data comes in.

Avatar

Dynamic moving averages, based on the selected date range, are used to better reflect trends and anomalies. Target-goals (green-dotted lines) and stretch-goals (yellow-dotted lines) are also mapped on the same visualization.

Avatar

The architecture is divided into four layers to allow easy addition and modification to the framework we built. There are concise documentation, along with full example code and in-code documentation on how to implement a new data source or new visualization.