Update your Nerdpack's catalog information

Add screenshots, descriptions, and other metadata to your Nerdpack, and upload it all to Instant Observability.

Update your CLI

Before you run any commands, ensure that you have the latest version of the CLI:

bash

$nr1 update

Check your permissions

To publish your Nerdpack and update its catalog information, you need:

Access to the account that published it
The necessary permissions for managing Nerdpacks

Publish your Nerdpack

You need to publish Nerdpacks that you create before you can update their catalog information.

Update your Nerdpack's catalog metadata

After you've published your Nerdpack to the Instant Observability catalog, update the Nerdpack's metadata to let users know all about your Nerdlets or visualizations.

Step 1 of 8

From New Relic homepage, navigate to Add data in the top navigation bar:

Step 2 of 8

Find your published Nerdpack using the Apps filter or search bar:

Published Nerdpack

Notice that there is no information or details page other than the Nerdpack's name and the brief description found in nr1.json:

Published Nerdpack

There are no screenshots, icons, details, or what's new features. For these, you need to provide catalog information to your Nerdpack.

Step 3 of 8

From the root of your Nerdpack, create catalog directories to house your Nerdpack's screenshots and metadata:

bash

$nr1 create --type catalog
✔  created: launchers/launcher/catalog
✔  created: nerdlets/home/catalog
✔  catalog created successfully!
   catalog is available at "./catalog"

Inside your root catalog directory, you'll find specific files and directories for portraying information about your Nerdpack to your users:

bash

$ls catalog
README.md         additionalInfo.md config.json       documentation.md  screenshots

File	Description
README.md	A markdown file that instructs you how to use the information and metadata in catalog
config.json	A JSON file that contains the following fields: `tagline`: A brief headline for the application. This cannot exceed 30 characters. `repository`: The URL for the Nerdpack's remote repository. This cannot exceed 1000 characters. `details`: The purpose of the Nerdpack and how to use it. This cannot exceed 1000 characters. Use newlines for formatting, and don't include any markdown or HTML. `categoryTerms`: A list of terms that matches the Nerdpack to a category in the Instant Observability catalog. You can look up a mapping of category terms with NerdGraph: US Query EU Query `keywords`: A list of relevant words to improve the search discoverability of the Nerdpack. This cannot exceed 50 words, and each word cannot exceed 64 characters. `support`: An object that contains: `issues`: A URL for the repository's issues list. For example, the Issues tab if using GitHub. `email`: A valid email address for the team supporting the application `community`: A URL for a support thread, forum, or website for troubleshooting and usage support `whatsNew`: A bulleted list of changes in the current release version. This cannot exceed 500 characters. Use newlines for formatting, and don't include markdown or HTML. Check out our Pageview Map application's config.json to see a real-life implementation.
documentation.md	A markdown file that tells users how to use the Nerdpack's Nerdlets or visualizations. This shows in the detail view's Documentation tab.
additionalInfo.md	An optional markdown file for any additional information about using your application
screenshots	A directory that contains screenshots showcasing your Nerdpack, such as select images of Nerdlets or visualizations. This can contain no more than 6 images. All screenshots must meet the following criteria: 3:2 aspect ratio PNG format landscape orientation 1600 to 2400 pixels wide

This command also generates a catalog directory for each launcher, Nerdlet, and visualization in your Nerdpack. Inside you'll find a directory that allows you to add screenshots for each Nerdpack item.

bash

$ls launchers/launcher/catalog
screenshots
$ls nerdlets/home/catalog
screenshots

Step 4 of 8

Update your Nerdpack's documentation.md file:

1
Enter your first and last name into the fields provided. When you're done, press **Submit** to see a personalized "Hello!" message.

catalog/documentation.md

1
{
2
  "tagline": "",
3
  "details": "",
4
  "categoryTerms": [],
5
  "keywords": [],
6
  "repository": "",
7
  "whatsNew": "",
8
  "support": {
9
    "email": {
10
      "address": ""
11
    },
12
    "issues": {
13
      "url": ""
14
    },
15
    "community": {
16
      "url": ""
17
    }
18
  }
19
}

catalog/config.json

Step 5 of 8

Update your config.json file:

1
Enter your first and last name into the fields provided. When you're done, press **Submit** to see a personalized "Hello!" message.

catalog/documentation.md

1
{
2
  "tagline": "Say hi!",
3
  "details": "DemoApp says Hello to a user.",
4
  "categoryTerms": [],
5
  "keywords": ["hello world"],
6
  "repository": "https://github.com/newrelic/developer-website",
7
  "whatsNew": "feat: Initial commit"
8
}

catalog/config.json

Step 6 of 8

Include screenshots in your root screenshots directory or any Nerdpack item screenshots directory.

Step 7 of 8

Submit the information to the Instant Observability catalog:

bash

$nr1 catalog:submit
Uploading screenshots from demo-app...
 ✔  Screenshots uploaded from: demo-app
Uploading screenshots from demo-app/launchers/launcher...
 ✔  Screenshots uploaded from: demo-app/launchers/launcher
Uploading screenshots from demo-app/nerdlets/home...
 ✔  Screenshots uploaded from: demo-app/nerdlets/home
 ✔  Updated metadata for DemoApp 1.0.0

Step 8 of 8

Go to Instant Observability to see your changes:

DemoApp with a tagline

Click your Nerdpack to see the new details:

App details

Click What's inside to see any screenshots you uploaded for individual items in your Nerdpack:

What's Inside Tab

Update your Nerdpack's icons

Within a Nerdpack, you can set two types of icons:

One for your entire Nerdpack, which represents your Nerdpack in the catalog
One for each of your launchers, which represents your Nerdlets

Replace these icons and publish your Nerdpack to see the changes.

Step 1 of 7

Update the icon.png in the root of your Nerdpack. This icon is used in the catalog and the Nerdpack's detail page.

Step 2 of 7

If you're building a Nerdpack with one or more launchers, update the icon.png in each of your launcher's subfolders.

Step 3 of 7

Update your package.json version:

{
  "private": true,
  "name": "demo-app",
  "version": "1.0.1",
  "scripts": {
    "start": "nr1 nerdpack:serve",
    "test": "exit 0"
  },
  "nr1": {
    "uuid": "f2dbc999-e9a3-49b9-933d-5a704c6750bd"
  },
  "dependencies": {
    "prop-types": "^15.6.2",
    "react": "^16.6.3",
    "react-dom": "^16.6.3"
  },
  "browserslist": ["last 2 versions", "not ie < 11", "not dead"]
}

package.json

This allows you to publish a new version of your Nerdpack.

Step 4 of 7

Publish your Nerdpack:

bash

$nr1 nerdpack:publish

Step 5 of 7

Update your whatsNew string in catalog/config.json:

1
Enter your first and last name into the fields provided. When you're done, press **Submit** to see a personalized "Hello!" message.

catalog/documentation.md

1
{
2
  "tagline": "Say hi!",
3
  "details": "DemoApp says Hello to a user.",
4
  "categoryTerms": [],
5
  "keywords": ["hello world"],
6
  "repository": "https://github.com/newrelic/developer-website",
7
  "whatsNew": "feat: Add new icons"
8
}

catalog/config.json

This will tell users what you added in the latest version of your Nerdpack.

Step 6 of 7

Submit this new metadata to the catalog:

bash

$nr1 catalog:submit
Uploading screenshots from demo-app...
 ✔  Screenshots uploaded from: demo-app
Uploading screenshots from demo-app/launchers/launcher...
 ✔  Screenshots uploaded from: demo-app/launchers/launcher
Uploading screenshots from demo-app/nerdlets/home...
 ✔  Screenshots uploaded from: demo-app/nerdlets/home
 ✔  Updated metadata for DemoApp 1.0.1

Step 7 of 7

Go to the catalog and subscribe to your Nerdpack to see your new icon:

Resolve issues with submitting catalog information

Sometimes, when you work with catalog metadata, you may run into issues. Consider some common solutions for resolving these issues.

Publish your Nerdpack

Remember that you can only submit catalog metadata for Nerdpacks that have already been published. If you try to submit information for a Nerdpack that hasn't been published, the CLI will try to help:

bash

$nr1 catalog:submit
Uploading screenshots...
 ›   Error: 1 error while updating DemoApp 1.0.0
 ›
 ›   Invalid Version: Nerdpack version 1.0.0 not found. Have you run `nr1 nerdpack:publish` yet?
 ›   Code: UNKNOWN

Resize your images

Screenshots for the catalog must meet the criteria specified previously in this guide. If they don't, the CLI will try to help:

bash

$nr1 catalog:submit
Uploading screenshots...
 ›   Error: 2 errors while updating DemoApp 1.0.1
 ›
 ›   catalog/screenshots/screenshot.png
 ›   Invalid Screenshot: screenshot.png has a size ratio of 4:2. Update size ratio to 3:2.
 ›
 ›   catalog/screenshots/screenshot.png
 ›   Invalid Screenshot: screenshot.png has a width of 3054px. Update size to be between 1600px and 2400px.
 ›   Code: UNKNOWN

Check the length of your strings

Most of the content in config.json has string-length requirements. Make sure you review those requirements and adhere to them when you update your config.json file. Otherwise, you'll see errors when you try to submit your configuration to the catalog:

bash

$nr1 catalog:submit
Uploading screenshots...
 ✔  Screenshots uploaded
 ›   Error: 2 errors while updating DemoApp 1.0.1
 ›
 ›   catalog/config.json
 ›   Invalid Metadata: `details` has a character length of 2204. Must be no longer than 1000 characters
 ›
 ›   catalog/config.json
 ›   Invalid Metadata: `tagline` has a character length of 266. Must be no longer than 30 characters
 ›   Code: UNKNOWN