Build apps on New Relic One

Build highly customized applications on New Relic One that meet your unique business needs, and are ready to be shared with your team. If you're familiar with React, GraphQL, and NRQL (our query language), it will take you only a few minutes to build a simple application.

Get started:

New Relic One Applications

Quick start part 1: Generate a simple example app

To build a New Relic One app, you need a paid or Developer Edition New Relic account. If you don't yet have an account, you can sign up for a Developer Edition account and start building.

If this is your first time building a New Relic One app, do the following:

  1. Go to one.newrelic.com.

  2. Select Build a New Relic One application

  3. Follow the instructions, which will walk you through:

    1. Downloading and installing the CLI.

    2. Generating a simple app template.

    3. Serving your app locally so it’s visible in one.newrelic.com

 

Quick start part 2: Copy/paste this example

Now that you have the CLI and have locally served a Nerdpack (if not, follow the instructions in the Build a New Relic One application launcher above), you can move on to adding functionality to your Nerdlets.

If you have a New Relic account with APM data, the following code will generate two charts using the New Relic One component library. These charts respect the time picker range selected in New Relic One, and interact with the navigation object to launch an APM Overview dashboard on an onClick event.

Paste the following into your Nerdlet’s index.js file, replacing the <YOUR_ACCOUNT_ID> with your New Relic account ID:

import React from 'react';
import { TableChart, LineChart, navigation, PlatformStateContext } from 'nr1';
 
export default class MyNerdlet extends React.Component {
 
    constructor(props) {
        super(props);
        this.accountId = <YOUR_ACCOUNT_ID>;    //My New Relic account ID
        this.openEntity = this.openEntity.bind(this);
    }
 
    openEntity(entityGuid) {
        navigation.openStackedEntity(entityGuid);
    }
 
    render(){
        const style = {
            height: '45vh',
            margin: '20px'
        };
        const nrql = `SELECT count(*) as 'transactions', apdex(duration) as 'apdex', percentile(duration, 99, 90, 70) FROM Transaction facet appName, entityGuid limit 25`;
        const trxOverT = `SELECT count(*) as 'transactions' FROM Transaction facet appName limit 25 TIMESERIES`;
        //return the JSX we're rendering
        return <PlatformStateContext.Consumer>
          {(platformUrlState) => {
              //console.debug here for learning purposes
              console.debug(platformUrlState); //eslint-disable-line
              const { duration } = platformUrlState.timeRange;
              const since = ` SINCE ${duration/60/1000} MINUTES AGO`;
              return <div style={{height: '100vh'}}>
                  <TableChart style={style} fullWidth={true} accountId={this.accountId}
                    query={nrql + since}
                    onClickTable={(dataEl, row, chart) => {
                        //for learning purposes, we'll write to the console.
                        console.debug("onClickTable", [dataEl, row, chart]) //eslint-disable-line
                        this.openEntity(row.entityGuid)
                    }}
                    />
                  <LineChart style={style} fullWidth={true} accountId={this.accountId}
                    query={trxOverT + since}
                    onClickLine={(...args) => {
                        //for learning purposes, we'll write to the console.
                        console.debug("onClickLine", args) //eslint-disable-line
                    }}
                    />
              </div>;
          }}
        </PlatformStateContext.Consumer>;
    }
}

The result should look something like the following:

New Relic One app - quick start

Now that you understand some basics, you can start to add the functionality you need.

To learn more, see our educational resources.

Tools for building on New Relic One

Command-line interface (CLI)

Our CLI gives you a command-line utility for working with the New Relic One SDK. Build, deploy, and manage with one tool.

Learn more

New Relic One SDK

From buttons and navigation to data fetching and APIs, we give you tools to build New Relic One applications.

Learn More

Chart library

It’s a speed thing. Our charts are fully configurable, provide meaningful animations, and lighten resource usage.

Learn more

Query and store data

Query, use, and store New Relic data or third-party data in your application.

Learn more

 

NerdStorage

NerdStorage lets you store simple sets of data, like configuration setting data or user-specific data (like favorites).

Learn more

Tools for collecting data

Agent APIs

The New Relic APM, Browser, and Mobile agents each include a variety of APIs for custom data reporting.

Learn more

Integrations SDK

New Relic Infrastructure includes numerous integrations with cloud technologies as well as on-host tools like Apache and Kubernetes.

Learn more

C SDK

Our C SDK is designed to support the often complex, multi-threaded nature of C/C++ applications.

Learn more

Telemetry SDK

The telemetry SDK gives you language-specific ways for getting metric or trace data into New Relic.

Learn more

Metric API

If the telemetry SDK doesn’t support your language or framework, use our metric API to send us metric data from any source.

Learn more

Trace API

Send distributed tracing data to New Relic and consolidate tracing data from multiple sources into one place.

Learn more

Log API

If our existing logging integrations don’t meet your needs, you can use our Log API to send any arbitrary log data to New Relic.

Learn more

Custom attributes

Add your own metadata to any of our core events with custom attributes. Analyze and act on the data you care about most.

Learn more

Custom events

Define, visualize, explore, and get alerts on data for a single event you're interested in, including from external sources.

Learn more

Tools for automating your toolchain

Auto-instrument infrastructure

New Relic integrates with popular config management tools like Chef, Puppet, and Ansible.

Learn more

REST APIs

Use REST APIs to help manage your New Relic entities, including basic CRUD operations.

Learn more

Alert webhooks

When your system goes down and alerts fire, you can use webhooks to automate your issue response and remediation services.

Learn more

Tutorials and guides

Learn how to do more with New Relic.

New Relic Developer Learning >

Connect with developers.

Find answers and connect with New Relic customers and staff.

New Relic Explorers Hub >