Integration Guide

React Integration

How to add the tracking snippet to standard React Single Page Applications (SPA).

React SPA Setup

For static React apps built using Vite, Create React App, or similar, you can inject the snippet directly into the public/index.html file or dynamically append it using a custom hook.

Option A: Modify index.html

Open public/index.html and paste the script tag inside the <head> element:

html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>React App</title>
    <!-- AIReady Bot Tracker -->
    <script src="https://aiready.co/t.js?id=YOUR_SITE_ID" async></script>
  </head>
  <body>
    <div id="root"></div>
  </body>
</html>

Option B: Use dynamic Hook in App component

If you want to inject the script programmatically upon React component mount:

typescript

import { useEffect } from 'react';

function useAIReadyTracker(siteId: string) {
  useEffect(() => {
    const script = document.createElement('script');
    script.src = `https://aiready.co/t.js?id=${siteId}`;
    script.async = true;
    document.head.appendChild(script);

    return () => {
      document.head.removeChild(script);
    };
  }, [siteId]);
}

← Back to Documentation Directory

Still having trouble with integration?

Reach out to our developer support team directly. We are happy to help get you verified.

Call Support