908 B
908 B
React SPA Example
A complete example of integrating analytics into a single-page React application.
Setup
# Install the client SDK
npm install @analytics/client
Files
analytics-setup.tsx- Provider configurationuse-page-tracking.ts- Automatic page view tracking hookuse-click-tracking.ts- Click tracking utilitiesuse-scroll-tracking.ts- Scroll depth tracking (built into provider)App.tsx- Example application with analytics
Key Concepts
1. Provider Setup
The AnalyticsProvider wraps your app and provides tracking context to all components.
2. Automatic Page Tracking
Use the usePageTracking hook in your layout to automatically track route changes.
3. Event Tracking
Use useAnalytics() hook to access tracking methods in any component.
4. Consent-Free
No consent banner needed - all session data is held in memory only.