Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.saytics.com/llms.txt

Use this file to discover all available pages before exploring further.

The Saytics JavaScript SDK lets you track user behavior directly from the browser. It works with any frontend framework — React, Vue, Angular, or plain JavaScript — and requires no build-tool plugins or additional configuration beyond installation.

Installation

Install the SDK using your preferred package manager.
npm install @saytics/js
# or
yarn add @saytics/js

Initialization

Initialize the SDK once at the entry point of your application, before any tracking calls are made.
import Saytics from '@saytics/js';

Saytics.init('YOUR_WRITE_KEY', {
  debug: false,         // Enable console logging
  autoPageview: true,   // Auto-track page views
});
Replace YOUR_WRITE_KEY with the write key from your Saytics workspace settings. When autoPageview is true, the SDK automatically sends a page view event on every navigation change, so you don’t need to call Saytics.page() manually for standard page loads.

Core methods

track(event, properties)

Use track to record any action a user takes in your app. The first argument is the event name; the second is an object of properties that describe the action.
Saytics.track('Button Clicked', {
  buttonId: 'cta-signup',
  page: '/pricing'
});

page(name, properties)

Use page to record a page view when autoPageview is disabled, or when you need to attach extra context to a view.
Saytics.page('Pricing', {
  referrer: document.referrer
});

identify(userId, traits)

Use identify to associate the current user with a known user ID and optional profile traits. Call this after login or sign-up.
Saytics.identify('user_123', {
  email: 'user@example.com',
  plan: 'pro'
});

reset()

Use reset to clear the anonymous session ID, typically when a user logs out.
// Call on logout to clear the anonymous ID
Saytics.reset();

Framework examples

The SDK integrates with any JavaScript framework. The examples below show where to place your tracking calls in the most common setups.
In React, place Saytics.track inside a useEffect hook to fire tracking calls after a component mounts.
import { useEffect } from 'react';
import Saytics from '@saytics/js';

function PricingPage() {
  useEffect(() => {
    Saytics.track('Page Viewed', {
      page: 'Pricing'
    });
  }, []);

  return <div>Pricing content</div>;
}
Call Saytics.reset() when a user logs out to prevent associating future events with the previous user’s profile.

Next steps