We have the application infrastructure in place, so it's time to build out the components that are going to rest on this infrastructure. First up is the dashboard, something that requires us to carefully consider how to implement the rest of our application.

The dashboard consists of two live charts and two historical charts. The live charts are very similar to each other, as are the historical charts (just some minor formatting and binding configuration between them). However, in order to build a chart, you also have to build the axes and the series being drawn on it, which results in a fairly long-winded configuration object. Here's what the historical log chart from the dashboard will look like:

{ 
    xtype: 'cartesian',
    title: 'Last 30 Days',
    margin: 10, flex: 1
    bind: '{historicalWebLogs}'
    axes: [{
        type: 'numeric',
        position: 'left',
        fields: ['value'],
        title: {
            text: 'Avg. Response \nTime (ms)',
            fontSize...