Skip to Content

PostHog Documentation

Overview

PostHog is integrated into this React Native app for product analytics, user behavior tracking, and session replay. It’s configured at the root level of the app navigation.

Configuration

PostHog is configured in components/layout/rootLayoutNavigation.tsx:

  • API Key: Set via EXPO_PUBLIC_POSTHOG_API_KEY environment variable
  • Autocapture:
    • Screen events: Disabled (handled by Expo Router)
    • Touch events: Enabled
  • Session Replay: Currently disabled
    • When enabled, all text inputs, images, and sandboxed views are masked for privacy

PostHog Dashboard

Access

Getting api key

  1. Log in to PostHog Cloud  or your self-hosted instance
  2. Select your project (Top right corner)
  3. Go to Project SettingsGeneral
  4. Copy the Project API key

Key Dashboard Sections

1. Insights (Analytics)

  • Events: View all captured events (screen views, button clicks, custom events)
  • Trends: Analyze event trends over time
  • Funnels: Track user conversion funnels
  • Retention: Measure user retention rates
  • Paths: Visualize user navigation paths

2. Persons (User Profiles)

  • View individual user profiles
  • See all events associated with a user
  • Filter users by properties or cohorts
  • Track user journeys across sessions

3. Session Replay (When Enabled)

  • Watch recorded user sessions
  • See exactly what users see and do
  • Debug issues by replaying user interactions
  • Privacy settings mask sensitive data automatically

4. Feature Flags

  • Manage feature rollouts
  • A/B test features
  • Target specific user segments
  • Control feature visibility

5. Experiments

  • Run A/B tests
  • Measure feature impact
  • Statistical significance testing
  • Conversion tracking

Best Practices

  • Event Naming: Use consistent, descriptive event names (e.g., button_clicked, screen_viewed)
  • Properties: Add relevant properties to events for better filtering
  • Privacy: Ensure sensitive data is masked in session replays
  • Performance: Monitor event volume to avoid performance issues
  • Retention: Set up retention analysis to track user engagement

Integration Details

The PostHog provider wraps the entire app in the root layout, ensuring all screens and interactions are tracked. To track custom events, use the PostHog client:

import { usePostHog } from 'posthog-react-native'; const posthog = usePostHog(); posthog.capture('custom_event', { property: 'value' });

Environment Setup

Add your PostHog API key to your environment variables:

EXPO_PUBLIC_POSTHOG_API_KEY=your_api_key_here

Resources