Analytics and Insights

Overview

The Analytics and Insights feature provides a simple way to track user behavior and gain insights into how users interact with your application. Turboship uses PostHog as the default analytics solution (but also, Google Analytics is supported).

PostHog is an open-source platform to analyze, test, observe, and deploy new features.

Setup

To enable analytics in your application, simply signup on PostHog and create a new project. After that, you will get a NEXT_PUBLIC_POSTHOG_KEY that you need to set in environment variable during production.

To track events, you can use the analytics object that is available in the @/lib/analytics module. Here's the full documentation of the analytics package and how to use it:

import analytics from '@/lib/analytics'
 
/* Track a page view */
analytics.page()
 
/* Track a custom event */
analytics.track('userPurchase', {
  price: 20,
  item: 'pink socks',
})
 
/* Identify a visitor */
analytics.identify('user-id-xyz', {
  firstName: 'bill',
  lastName: 'murray',
  email: 'da-coolest@aol.com',
})

Tracking Events

To track events, you either track events manually or use the component <TrackableButton />:

<TrackableButton
  asChild
  event="InitiateCheckout"
  payload={{
    currency: 'BRL',
    value: 9.99,
  }}
  options={{
    eventID,
  }}
>
  <Button>Checkout</Button>
</TrackableButton>

Note that the eventID is a unique identifier for the event. You can use it to track the event in the PostHog dashboard / Facebook Pixel.

Since the TrackableButton is a client side component, it will only track events when the user clicks the button. If you want to track events on the server side, you can use the analytics.track method.