The NovuProvider is the top-level component that provides the Novu instance to the rest of the hooks through the context. Usually, it’s placed somewhere in the root of your application, which makes the hooks accessible throughout the application.

​
NovuProvider props

applicationIdentifier
string
required

applicationIdentifier is a unique identifier for the application. This is is public credential that is used to authenticate the application with the Novu API. applicationIdentifier can be copied from API Keys page.

subscriberId
string
required

subscriberId is a unique identifier for the subscriber. Read more about subscribers.

subscriberHash
string

subscriberHash is a unique identifier for the subscriber. It is used for HMAC encryption. Read more about HMAC Encryption.

backendUrl
string
default: "https://api.novu.co"

Use https://eu.api.novu.co value for EU region.

socketUrl
string
default: "https://ws.novu.co"

Use https://eu.ws.novu.co value for EU region.

useCache
boolean

The field is used to enable/disable the cache for the notifications and preferences. By default, the cache is enabled.

​
Example usage

import { NovuProvider } from '@novu/react/hooks';

function App() {
  return (
    <NovuProvider
      subscriberId="YOUR_SUBSCRIBER_ID"
      applicationIdentifier="YOUR_APPLICATION_IDENTIFIER"
    >
      {/* Your app components where you want to use the hooks */}
      <YourCustomInbox />
    </NovuProvider>
  );
}
```

Was this page helpful?

OverviewuseNotifications