Tracking
Tracking Conversions

Tracking Conversions

Want to track conversion events?

To optimize your analytics, you must monitor how many individuals actually convert. A conversion is an event that occurs when a user does a desired action on your website. For example:

  • Someone subscribes your Newsletter.
  • Someone submits your Contact form.
  • Someone purchases the plan for your SaaS.

This is by far the most important indicator for comparing the performance of your versions side by side in the TestNix dashboard. All you have to do is track the conversion in your app when a user does the appropriate action.

Start Tracking Conversions

ClientComponent.tsx
"use client";
import { useMutation } from '@tanstack/react-query'
import { useState } from 'react'
import { useTestNix } from 'splitter-gg/client'
 
const ClientComponent = () => {
const { trackConversions } = useTestNix()
const [email, setEmail] = useState('')
 
const { mutate: signupForNewsletter } = useMutation({
  mutationFn: async (email: string) => {
    await fetch('/api/newsletter', {
      method: 'POST',
      body: JSON.stringify({ email }),
    })
  },
  onSuccess: () => {
    // track newsletter sign-up conversion
    trackConversions('experiment-id', 'variant-id', 'experiment-hash') 
  },
})
 
return (
  <div>
    <input
      type='text'
      value={email}
      onChange={({ target }) => setEmail(target.value)}
    />
    <button onClick={() => signupForNewsletter(email)}>Sign up now</button>
  </div>
)
}
 
export default ClientComponent

Parameters

  • experimentId string required

The Id is given in the testnix dashboard.

  • experimentHash string required

The Hash is given in the testnix dashboard.

  • variantId JSX Elements required

Any unique Id can be provided.