This provides a straightforward way to integrate MetricStory analytics into your web application.
Before using the SDK, ensure you have generated an API token from MetricStory.ai. This token is required for authorizing requests to MetricStory's API.
For added security, you can add a domain in MetricStory.ai as well
Install the module
npm install metricstory
Import the MetricStory
provider and initialize it with your API token.
import { MetricStoryProvider } from 'metricstory';
export default function App() {
return (
<MetricStoryProvider apiKey='key-XXXXX'>
<BrowserRouter />
</MetricStoryProvider>
)
}
To associate events and page views with a user, call the identify
method. This makes it easier to track user actions across your application.
metricStory.identify({ userId: "user's unique ID", first_name: "First Name", last_name: "Last Name" });
It's a good practice to call this method right after a user logs in or when the user information is updated.
You can track custom events using the track
method. This is useful for understanding the actions users are taking in your web application.
metricStory.track({ event: "USER_SIGNED_UP", properties: { plan: "Pro" } });
The SDK automatically tracks page loads when the MetricStory
class is first initialized. However, if you need to track page views manually (e.g., in single-page applications), you can use the page
method as shown below.
metricStory.page({ page: '/home', properties: { plan: 'Free' } });