Add your dashboard to the quickstart

Course

This procedure is a part of course that teaches you how to build a quickstart. If you haven't already, checkout the course introduction

As this procedure builds on top of the last ones in the lab, make sure you create a dashboard and understand the directory structure of quickstart before proceeding with this one.

In a previous procedure, you created a dashboard to monitor FlashDB. Now, you add it to your quickstart so your users can use it too.

Step 1 of 6

If you haven't already, fork the New Relic quickstarts repository and clone it to your local machine.

Step 2 of 6

Open your Project in the IDE of your choice and navigate to _template directory.

quickstart template

Step 3 of 6

Here, copy dashboards/example-dashboard directory and it's content to dashboards directory at the root level. Rename the directory as flashdb.

This directory contains a sample JSON file and its corresponding image to contribute your dashboard to New Relic I/O.

Step 4 of 6

Next, navigate to New Relic and look up your dashboard. From here, copy its JSON.

copy flashdb dashboard

Step 5 of 6

Save it as a JSON file in the dashboards/flashdb directory and rename the file as "flashdb.json".

save flashdb dashboard as json file

Here, you copied your dashboard's JSON to clipboard. Replace the content of existing JSON file in dashboards/flashDB directory and rename it as flashdb.json. Your flashdb.json file should contain the following content:

{
  "name": "flashdb",
  "description": null,
  "permissions": "PUBLIC_READ_WRITE",
  "pages": [
    {
      "name": "flashdb",
      "description": null,
      "widgets": [
        {
          "title": "Database methods",
          "layout": {
            "column": 1,
            "row": 1,
            "width": 8,
            "height": 6
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.pie"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": true
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 1234567,
                "query": "SELECT count(*) FROM fdb_method FACET method "
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            }
          }
        },
        {
          "title": "Database size",
          "layout": {
            "column": 9,
            "row": 1,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.billboard"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "nrqlQueries": [
              {
                "accountId": 1234567,
                "query": "SELECT latest(fdb_size) FROM Metric"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            }
          }
        },
        {
          "title": "Average response time",
          "layout": {
            "column": 9,
            "row": 4,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 1234567,
                "query": "SELECT average(fdb_create_responses), average(fdb_read_responses), average(fdb_update_responses), average(fdb_delete_responses) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        },
        {
          "title": "Cache hits",
          "layout": {
            "column": 1,
            "row": 7,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 1234567,
                "query": "SELECT sum(fdb_cache_hits) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        },
        {
          "title": "Errors",
          "layout": {
            "column": 5,
            "row": 7,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 1234567,
                "query": "SELECT sum(fdb_create_errors), sum(fdb_read_errors), sum(fdb_update_errors), sum(fdb_delete_errors) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        },
        {
          "title": "FlashDB keys",
          "layout": {
            "column": 9,
            "row": 7,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 1234567,
                "query": "SELECT count(fdb_keys) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        }
      ]
    }
  ]
}

Step 6 of 6

Next, create a screenshot of your dashboard and add it to dashboards/flashdb directory. Give it the same name as your JSON file. Your dashboards/flashDB directory should look similar to the following:

FlashDB dashboard

Sanitize your dashboard

When you add your dashboard to the quickstart, you need to remove sensitive data. For example:

Do not include permissions: PUBLIC_READ_WRITE
Set all linkedEntityGuids to null
Set your accountId to 0

We've created a script to automate this process for you. To remove sensitive and unnecessary data from your dashboard, navigate to newrelic-quickstarts/utils and execute the sanitize-dashboard script.

bash

$cd newrelic-quickstarts/utils
$yarn install
$yarn sanitize-dashboard flashdb

Your flashdb.json file should now look like the following.

{
  "name": "flashDB",
  "description": null,
  "pages": [
    {
      "name": "flashDB",
      "description": null,
      "widgets": [
        {
          "title": "Database methods",
          "layout": {
            "column": 1,
            "row": 1,
            "width": 8,
            "height": 6
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.pie"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": true
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 0,
                "query": "SELECT count(*) FROM fdb_method FACET method "
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            }
          }
        },
        {
          "title": "Database size",
          "layout": {
            "column": 9,
            "row": 1,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.billboard"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "nrqlQueries": [
              {
                "accountId": 0,
                "query": "SELECT latest(fdb_size) FROM Metric"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            }
          }
        },
        {
          "title": "Average response time",
          "layout": {
            "column": 9,
            "row": 4,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 0,
                "query": "SELECT average(fdb_create_responses), average(fdb_read_responses), average(fdb_update_responses), average(fdb_delete_responses) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        },
        {
          "title": "Cache hits",
          "layout": {
            "column": 1,
            "row": 7,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 0,
                "query": "SELECT sum(fdb_cache_hits) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        },
        {
          "title": "Errors",
          "layout": {
            "column": 5,
            "row": 7,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 0,
                "query": "SELECT sum(fdb_create_errors), sum(fdb_read_errors), sum(fdb_update_errors), sum(fdb_delete_errors) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        },
        {
          "title": "FlashDB keys",
          "layout": {
            "column": 9,
            "row": 7,
            "width": 4,
            "height": 3
          },
          "linkedEntityGuids": null,
          "visualization": {
            "id": "viz.line"
          },
          "rawConfiguration": {
            "facet": {
              "showOtherSeries": false
            },
            "legend": {
              "enabled": true
            },
            "nrqlQueries": [
              {
                "accountId": 0,
                "query": "SELECT count(fdb_keys) FROM Metric TIMESERIES"
              }
            ],
            "platformOptions": {
              "ignoreTimeRange": false
            },
            "yAxisLeft": {
              "zero": true
            }
          }
        }
      ]
    }
  ]
}

Lab

This procedure is a part of course that teaches you how to build a quickstart. Continue on to next procedure: add your alerts to quickstart.