Nerdpack file structure

A New Relic One application is represented by a Nerdpack folder, which can include one or more Nerdlet files, and (optionally) one or more launcher files. This document explains:

For basic component definitions, see our developer site.

Generate Nerdpack components

There are two ways to generate a Nerdpack template:

  • Generate Nerdpack. Use the CLI command nr1 create and select Nerdpack to create a Nerdpack template that includes a Nerdlet and a launcher.
  • Generate Nerdlet or launcher individually. You can use the CLI command nr1 create and choose to select either a Nerdlet or launcher. This may be useful when adding Nerdlets to an existing Nerdpack.

For a lesson on generating and connecting Nerdpack components, see the workshop.

Nerdpack file structure

When you generate a Nerdpack template using the CLI nr1 create command, it has this file structure:

├── launchers
│   └── my-nerdlet-launcher
│       ├── icon.png
│       └── nr1.json
├── nerdlets
│   └── my-nerdlet-nerdlet
│       ├── index.js
│       ├── nr1.json
│       └── styles.scss
├── node_modules
│   ├── js-tokens
│   ├── loose-envify
│   ├── object-assign
│   ├── prop-types
│   ├── react
│   ├── react-dom
│   ├── react-is
│   └── scheduler
├── nr1.json
├── package-lock.json
└── package.json

Nerdlet file structure

A Nerdpack can contain one or more Nerdlets. A Nerdlet folder starts out with three default files:


The JavaScript code. Here's what the default file looks like when a Nerdlet is generated with the CLI nr1 create:

import React from 'react';

export default class MyAwesomeNerdpack extends React.Component {
    render() {
	<h1>Hello, my-awesome-nerdpack Nerdlet!</h1>

Configuration file. Here is the default file generated by the CLI nr1 create command:

    "schemaType": "NERDLET",
    "id": "my-awesome-nerdpack-nerdlet",
    "description": "Describe me",
    "displayName": "MyAwesomeNerdpack"

Besides using the launcher as the access point for your application, you can also associate the application with a monitored entity to get it to appear in the New Relic One entity explorer. To do this, add two additional fields to the config file of the first-launched Nerdlet: entities and actionCategory. In the following example, the Nerdlet has been associated with all New Relic Browser-monitored applications and will appear under the Monitor UI category :

    "schemaType": "NERDLET",
    "id": "my-nerdlet",
    "description": "Describe me",
    "displayName": "Custom Data",
    "entities": [{"domain": "BROWSER", "type": "APPLICATION"}],
    "actionCategory": "monitor"

To see this application in the UI, you would go to the New Relic One entity explorer, select Browser applications, and select a monitored application.


The file for CSS styles (Sass SCSS syntax).

Launcher file structure

When an application with a launcher file has been deployed, its launcher is located on the New Relic One home page (

A launcher is not required; as an alternative to using a launcher, you can associate your application with a monitored entity. An application can have more than one launcher; this may be desired for an application with multiple Nerdlets.

A launcher folder contains two files:


The configuration file. Here is the default file template created by the nr1 create command:

    "schemaType": "LAUNCHER",
    "id": "my-awesome-nerdpack-launcher",
    "description": "Describe me",
    "displayName": "MyAwesomeNerdpack",
    "rootNerdletId": "my-awesome-nerdpack-nerdlet"    

To connect a launcher to a Nerdlet, the rootNerdletId must match the id in the launched Nerdlet's nr1.json config file. For Nerdpacks with multiple Nerdlets, this needs to be done only for the first-launched Nerdlet.


The launcher icon that appears on the home page when an application is deployed.

For more help

Recommendations for learning more: