• Log inStart now

Nerdpack file structure

A New Relic application is represented by a Nerdpack folder, which can include one or more Nerdlet files, and (optionally) one or more launcher files. Here we explain:

  • The file structure for a Nerdpack, a Nerdlet, and a launcher
  • How to link a launcher file to a Nerdlet
  • How to link your application with a monitored entity

For basic component definitions, see our component reference.

Generate Nerdpack components

There are two ways to generate a Nerdpack template:

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

For documentation on generating and connecting Nerdpack components, see our app building guides and the New Relic One CLI command reference.

Nerdpack file structure

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

my-nerdlet
├── README.md
├── 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, index.js, nr1.json, and styles.scss. Here is what the default files look like after being generated using the nr1 create command:

index.js

The JavaScript code of the Nerdlet.

import React from 'react';
export default class MyAwesomeNerdpack extends React.Component {
render() {
return <h1>Hello, my-awesome-nerdpack Nerdlet!</h1>;
}
}

nr1.json

The Nerdlet configuration file.

{
"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 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 Browser-monitored applications and will appear under the Monitor UI category :

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

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

styles.scss

An empty SCSS file for styling your application.

icon.png

The launcher icon that appears on the Apps page in New Relic when an application is deployed.

Launcher file structure

Launchers have their own file structure. Note that:

After generating a launcher using the nr1 create command, its folder contains two files:

nr1.json

The configuration file.

{
"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.

icon.png

The icon displayed on the launcher for the app on the Apps page.

Copyright © 2024 New Relic Inc.

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.