React, Next.js and React Native

npm install @iforevents/react

import { IforeventsProvider, useTrack, usePageView } from "@iforevents/react";
import { useLocation } from "react-router-dom";

function PageViews() {
  usePageView(useLocation().pathname); // one page view per route change
  return null;
}

export function App() {
  return (
    <IforeventsProvider projectKey="pk_...">
      <PageViews />
      <Checkout />
    </IforeventsProvider>
  );
}

function Checkout() {
  const track = useTrack();
  return <button onClick={() => track("checkout_started", { items: 3 })}>Buy</button>;
}

npm install @iforevents/next

// app/layout.tsx
import { IforeventsProvider } from "@iforevents/next";

export default function RootLayout({ children }) {
  return (
    <html><body>
      <IforeventsProvider projectKey={process.env.NEXT_PUBLIC_IFOREVENTS_PROJECT_KEY!}>{children}</IforeventsProvider>
    </body></html>
  );
}

import { getServerIforevents } from "@iforevents/next/server";
const { iforevents } = await getServerIforevents({ projectKey: process.env.IFOREVENTS_PROJECT_KEY! });
await iforevents.track("order_created", { total: 42 });

npm install @iforevents/react-native @react-native-async-storage/async-storage
npm install react-native-device-info   # optional, richer device context

import { NavigationContainer, createNavigationContainerRef } from "@react-navigation/native";
import { createReactNativeIforevents, trackNavigation } from "@iforevents/react-native";

export const analytics = createReactNativeIforevents("pk_...");
const navRef = createNavigationContainerRef();

export default function App() {
  return <NavigationContainer ref={navRef} {...trackNavigation(analytics, navRef)}>{/* screens */}</NavigationContainer>;
}

await analytics.identify("user_123", { plan: "pro" });
await analytics.track("purchase_completed", { total: 9.99 });