The package is based on new-relic-react package by reggi and later forked by wanderio. This variation includes a recent version of New Relic Browser plugin to inject JavaScript snippet to instrument your app's webpages. The javascript provided in this library include all Pro and SPA features of new relic's browser agent.

It also includes rollup.js to bundle source code as React component.

Getting Started

new-relic-react-lib can be installed as any other npm package:

npm install --save @creditas/new-relic-react-lib

Application Structure

.
├── src                     # Source files
│   ├── __tests__           # Test files
│   │   └── index.test.js   # Test cases for New Relic - React component
│   ├── index.js            # New Relic - React component source code
│   ├── index.d.ts          # Types for each accepted prop
├── package.json            # Package information with list of dependencies
├── LICENSE.md
└── README.md

Props

Name	Type	Is Required	Default value	Notes
accountID	String	`true`	-	(Recently Added) Different per environment (staging/prod).
agentID	String	`true`	-	(Recently Added) Different per account and application.
applicationID	String	`true`	-	-
licenseKey	String	`true`	-	-
agent	String	`false`	js-agent.newrelic.com/nr-spa-1210.min.js	-
beacon	String	`false`	bam-cell.nr-data.net	(Recently Updated) With the new script version, the default domain value was changed from `bam.nr-data.net` to `bam-cell.nr-data.net`.
errorBeacon	String	`false`	bam-cell.nr-data.net	(Recently Updated) With the new script version, the default domain value was changed from `bam.nr-data.net` to `bam-cell.nr-data.net`.
onlyConfig	Boolean	`false`	`false`	Defines if it will return a component or only the script of New Relic.
sa	Number	`false`	1	-
trustKey	String	`false`	735288	(Recently Added) It does not change accross different envs/applications.

Usage

Retrieving information

Go to one.newrelic.com > Browser > (select an app) > Settings > Application settings.
Retrieve this information from your New Relic account inside the "Agent and account" script:
- accountID: Current New Relic account ID
- agentID: Current New Relic agent ID
- licenseKey: New Relic account license key
- applicationID: Current New Relic application ID

Using the component

Import NewRelic into your component and pass the information as props.

Make sure to change the onlyConfig prop if you want to get only the script configuration, without the <script /> tag.

Example: using NewRelic component

import React from 'react'
import { NewRelic } from '@creditas/new-relic-react-lib'

const Html = () => {
  return (
    <html>
      <head>
        <meta charSet="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <meta httpEquiv="x-ua-compatible" content="ie=edge" />
        <NewRelic
          applicationID="www"
          licenseKey="xxx"
          agentID="yyy"
          accountID="zzz"
        />
        <title>Web App</title>
      </head>
      <body>
        <div id="app">{children}</div>
      </body>
    </html>
  )
}

export default Html

Example: using NewRelic component inside a `<script />` tag

import React from 'react'
import { NewRelic } from '@creditas/new-relic-react-lib'

const Html = () => {
  return (
    <html>
      <head>
        <meta charSet="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <meta httpEquiv="x-ua-compatible" content="ie=edge" />
        <script type="text/javascript">
          <NewRelic
            applicationID="www"
            licenseKey="xxx"
            agentID="yyy"
            accountID="zzz"
            onlyConfig
          />
        </script>
        <title>Web App</title>
      </head>
      <body>
        <div id="app">{children}</div>
      </body>
    </html>
  )
}

export default Html

Contributing

All contributions must be done through opening pull requests.

Deploy

Deploy is automaticaly made by CircleCI when you set a tag in your git project. First hand, change the version in the package.json. To ensure consistency check JFrog to see which is the latest version released, then, add a tag to git

git checkout master
git tag vX.Y.Z
git checkout vX.Y.Z
git push origin vX.Y.Z

License

MIT - http://opensource.org/licenses/mit-license.php

Based on https://github.com/wanderio/new-relic-react

FAQs

What is @creditas/new-relic-react-lib?

Is @creditas/new-relic-react-lib well maintained?

Package last updated on 26 Aug 2021

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

@creditas/new-relic-react-lib

New Relic - React integration plugin