---
title: Analytics quickstarts
description: "Welcome to the Analytics quickstarts section of the Luigi's Box documentation. This collection of quickstarts is your starting point and the most critical component for a successful Luigi's Box integration. Here, you will learn how to track user interactions on your website or application, providing the essential data that powers our intelligent search, insightful recommendations, and optimized product listings."
slug: quickstart/analytics
docKind: hub
hub: quickstart
---

Analytics is the foundation of Luigi's Box learning. Before moving into Search, Autocomplete, Recommendations, or Product Listing, make sure your event tracking and object identity strategy are solid.

## Choose your path

<div class="choice-container">
  <a class="choice-card" href="/quickstart/analytics/datalayer-first-search/">
    <span class="choice-badge" data-recommended="true">Recommended for web</span>
    <h3>DataLayer Collector</h3>
    <p>Use the JavaScript collector when your storefront already has a `dataLayer` or GA4-style ecommerce events.</p>
    <ul class="advantages-list">
      <li>Fastest path for websites.</li>
      <li>Works naturally with existing ecommerce events.</li>
      <li>Pairs well with Luigi's Box frontend libraries.</li>
    </ul>
  </a>
  <a class="choice-card" href="/quickstart/analytics/events-api-first-search/">
    <span class="choice-badge">Backend and mobile</span>
    <h3>Events API</h3>
    <p>Send analytics events directly from your backend or mobile app when you need full control over event delivery.</p>
    <ul class="advantages-list">
      <li>No browser collector required.</li>
      <li>Fits mobile and server-side architectures.</li>
      <li>Gives you explicit control over payloads.</li>
    </ul>
  </a>
</div>

## Quickstart collection

<div class="lb-guide-group">
  <p class="lb-guide-kicker">Foundation</p>
  <h3>Start here</h3>
  <p>Establish the identity model that all analytics and catalog data will share.</p>
  <div class="lb-guide-grid">
    <a class="lb-guide-card" href="/quickstart/analytics/object-identity/">
      <h3>Analytics and object identity</h3>
      <p>Understand the feedback loop and how consistent identifiers keep Luigi's Box learning accurate.</p>
    </a>
  </div>
</div>

<div class="lb-guide-group">
  <p class="lb-guide-kicker">DataLayer Collector</p>
  <h3>Frontend tracking path</h3>
  <p>Use these guides when the browser is responsible for reporting ecommerce events.</p>
  <div class="lb-guide-grid">
    <a class="lb-guide-card" href="/quickstart/analytics/datalayer-first-search/">
      <h3>Track your first search</h3>
      <p>Report result views and clicks from search or autocomplete lists.</p>
    </a>
    <a class="lb-guide-card" href="/quickstart/analytics/datalayer-tracking-purchases/">
      <h3>Track purchases and conversions</h3>
      <p>Add `add_to_cart` and `purchase` tracking so the models learn from conversion signals.</p>
    </a>
  </div>
</div>

<div class="lb-guide-group">
  <p class="lb-guide-kicker">Events API</p>
  <h3>Backend and mobile path</h3>
  <p>Use these guides when you need to send analytics directly to Luigi's Box.</p>
  <div class="lb-guide-grid">
    <a class="lb-guide-card" href="/quickstart/analytics/events-api-first-search/">
      <h3>Send your first search events</h3>
      <p>Start with search and click events sent through the API.</p>
    </a>
    <a class="lb-guide-card" href="/quickstart/analytics/events-api-tracking-purchases/">
      <h3>Track purchases and conversions</h3>
      <p>Extend the API flow with add-to-cart and transaction reporting.</p>
    </a>
  </div>
</div>

<div class="lb-guide-group">
  <p class="lb-guide-kicker">Verification</p>
  <h3>Debug your setup</h3>
  <p>Check that events are flowing correctly before you move deeper into product integrations.</p>
  <div class="lb-guide-grid">
    <a class="lb-guide-card" href="/quickstart/analytics/start-debugging/">
      <h3>Debugging your analytics</h3>
      <p>Use the linter and live session explorer to validate your implementation.</p>
    </a>
  </div>
</div>
