analytics/examples/ecommerce/README.md
2026-01-29 08:20:58 -08:00

2.3 KiB

E-commerce Analytics Examples

Product analytics, cart tracking, and purchase funnel examples.

Features

  • Product view and impression tracking
  • Cart add/remove/update events
  • Checkout funnel with step tracking
  • Purchase conversion tracking
  • Revenue attribution
  • Product recommendation tracking

Files

File Description
product-analytics.ts Product view, impression, and interaction tracking
cart-analytics.ts Shopping cart event tracking
checkout-analytics.ts Multi-step checkout funnel tracking
use-product-tracking.ts React hook for product pages
use-cart-tracking.ts React hook for cart integration

Quick Start

Product Tracking

import { useProductTracking } from './use-product-tracking';

function ProductPage({ product }) {
  const { trackView, trackAddToCart, trackWishlist } = useProductTracking(product);

  // Track view on mount
  useEffect(() => {
    trackView();
  }, []);

  return (
    <div>
      <h1>{product.name}</h1>
      <button onClick={() => trackAddToCart(1)}>Add to Cart</button>
      <button onClick={() => trackWishlist()}>Add to Wishlist</button>
    </div>
  );
}

Cart Tracking

import { useCartTracking } from './use-cart-tracking';

function CartProvider({ children }) {
  const { trackAdd, trackRemove, trackUpdate, trackCheckoutStart } = useCartTracking();

  const addToCart = (product, quantity) => {
    // Your cart logic
    cart.add(product, quantity);
    // Track the event
    trackAdd(product, quantity);
  };

  // ...
}

Checkout Funnel

import { useCheckoutFunnel } from './checkout-analytics';

function CheckoutPage() {
  const funnel = useCheckoutFunnel(cart);

  return (
    <CheckoutWizard
      onStepComplete={(step) => funnel.trackStep(step)}
      onPurchase={(order) => funnel.trackPurchase(order)}
      onAbandonment={(step) => funnel.trackAbandonment(step)}
    />
  );
}

Metrics Tracked

Product Metrics

  • Product views
  • Product impressions (in lists)
  • Add to cart rate
  • Wishlist additions

Cart Metrics

  • Cart additions/removals
  • Average cart value
  • Cart abandonment

Checkout Metrics

  • Checkout initiation rate
  • Step completion rates
  • Drop-off analysis
  • Purchase conversion
  • Revenue per session