Alytica React Native SDK

A React Native SDK for integrating with the Alytica analytics platform. Track events, identify users, and gain valuable insights into your app's performance and user behavior.

Installation

npm install alytica-react-native
# or
yarn add alytica-react-native

Quick Start

import Alytica from 'alytica-react-native';

// Initialize the Alytica client
const alytica = new Alytica({
  clientId: 'YOUR_CLIENT_ID',
  api_host: 'https://api.alytica.tech',
  debug: false,
});

// Initialize the SDK
alytica.init();

// Track an event
alytica.track('button_clicked', {
  buttonName: 'Sign Up',
  source: 'home_screen'
});

// Identify a user
alytica.identify('user123', {
  email: '[email protected]',
  plan: 'premium'
});

Key Features

• Event Tracking: Track user interactions and custom events
• User Identification: Associate events with specific users
• Session Management: Track user sessions automatically
• Group Analytics: Organize users into groups for better analysis
• Customizable: Set global properties to include with all tracked events

API Reference

Initialization

const alytica = new Alytica({
  clientId: 'YOUR_CLIENT_ID',     // Required
  clientSecret: 'YOUR_SECRET',    // Optional, for secure server-side tracking
  api_host: 'https://api.alytica.tech', // Optional, defaults to https://api.alytica.tech
  debug: false,                  // Optional, enables debug logging
  disabled: false,               // Optional, disables all tracking
  processProfiles: true          // Optional, enables user profile processing
});

alytica.init();

Tracking Events

// Simple event
alytica.track('page_viewed');

// Event with properties
alytica.track('product_added', {
  productId: '123',
  price: 99.99,
  currency: 'USD'
});

User Identification

// Associate a user ID with the current user
alytica.identify('user123');

// Associate a user ID with additional properties
alytica.identify('user123', {
  name: 'John Doe',
  email: '[email protected]',
  plan: 'premium'
});

Group Analytics

// Associate a user with a group
alytica.group('company', 'acme_inc');

// With additional properties
alytica.group('company', 'acme_inc', {
  plan: 'enterprise',
  employees: 500
});

User Aliasing

// Associate an anonymous ID with a new user ID
alytica.alias('user123', 'anonymous_id_456');

Global Properties

// Set properties to be included in all tracked events
alytica.setGlobalProperties({
  appVersion: '1.2.3',
  environment: 'production'
});

Reset User

// Reset the current user, generating a new anonymous ID
await alytica.reset();

Screen View Tracking

With Expo Router

import { usePathname, useSegments } from 'expo-router';
import Alytica from 'alytica-react-native';

const alytica = new Alytica({
  clientId: 'YOUR_CLIENT_ID',
  api_host: 'https://api.alytica.tech',
});

function RootLayout() {
  // ...
  const pathname = usePathname();
  // Segments is optional but can be nice to have if you
  // want to group routes together
  // pathname = /posts/123
  // segments = ['posts', '[id]']
  const segments = useSegments();

  useEffect(() => {
    // Simple
    alytica.track('screen_view', { screen: pathname });

    // With extra data
    alytica.track('screen_view', {
      screen: pathname,
      // segments is optional but nice to have
      segments: segments.join('/'),
      // other optional data you want to send with the screen view
    });
  }, [pathname, segments]);
  // ...
}

With React Navigation

import { createNavigationContainerRef, NavigationContainer } from '@react-navigation/native';
import Alytica from 'alytica-react-native';

const alytica = new Alytica({
  clientId: 'YOUR_CLIENT_ID',
  api_host: 'https://api.alytica.tech',
});

const navigationRef = createNavigationContainerRef();

export function NavigationRoot() {
  const handleNavigationStateChange = () => {
    const current = navigationRef.getCurrentRoute();
    if (current) {
      alytica.track('screen_view', {
        screen: current.name,
        params: current.params,
      });
    }
  };

  return (
    <NavigationContainer
      ref={navigationRef}
      onReady={handleNavigationStateChange}
      onStateChange={handleNavigationStateChange}
    >
      <Stack.Navigator />
    </NavigationContainer>
  );
}

License

MIT