Intro to New Relic One SDK

Components of the SDK

SDK components are located in the Node module package named nr1, which you get when you install the NR1 CLI. The nr1 components can be divided into several categories:

• UI components
• Chart components
• Query and storage components
• Platform APIs

UI components

The UI components category of the SDK contains React UI components, including:

• Text components: These components provide basic font and heading elements. These include HeadingText and BlockText.

• Layout components: These components give you control over the layout, and help you build complex layout designs without having to deal with the CSS. Layout components include:

  • Grid and GridItem: for organizing more complex, larger scale page content in rows and columns

  • Stack and StackItem: for organizing simpler, smaller scale page content (in column or row)

  • Tabs and TabsItem: group various related pieces of content into separate hideable sections

  • List and ListItem: for providing a basic skeleton of virtualized lists

  • Card, CardHeader and CardBody : used to group similar concepts and tasks together

• Form components: These components provide the basic building blocks to interact with the UI. These include Button, TextField, Dropdown and DropdownItem, Checkbox, RadioGroup, Radio, and Checkbox.

• Feedback components: These components are used to provide feedback to users about actions they have taken. These include: Spinnerand Toast.

• Overlaid components: These components are used to display contextual information and options in the form of an additional child view that appears above other content on screen when an action or event is triggered. They can either require user interaction (like modals), or be augmenting (like a tooltip). These include: Modal and Tooltip.

Components suffixed with Item can only operate as direct children of that name without the suffix. For example: GridItem should only be found as a child of Grid.

Chart components

The Charts category of the SDK contains components representing different types of charts. The ChartGroup component helps a group of related charts share data and be aligned.

Some chart components can perform NRQL queries on their own; some accept a customized set of data.

Query and storage components

The Query components category contains components for fetching and storing New Relic data.

The main way to fetch data is with NerdGraph, our GraphQL endpoint. This can be queried using NerdGraphQuery. To simplify use of NerdGraph queries, we provide some components with pre-defined queries. For more on using NerdGraph, see Queries and mutations.

We also provide storage for storing small data sets, such as configuration settings data, or user-specific data. For more on this, see NerdStorage.

Platform APIs

The Platform API components of the SDK enable your application to interact with different parts of the New Relic platform, by reading and writing state from and to the URL, setting the configuration, etc. They can be divided into these categories:

• PlatformStateContext: provides read access to the platform URL state variables. Example: timeRange in the time picker.
• navigation: an object that allows programmatic manipulation of the navigation in New Relic. Example: opening a new Nerdlet.
• NerdletStateContext: provides read access to the Nerdlet URL state variables. Example: an entityGuid in the entity explorer.
• nerdlet: allows you to configure your Nerdlet and write to your Nerdlet's URL state.