# Add Privatus Analytics to Remix

> Add cookieless analytics to Remix or React Router 7 framework mode in app/root.tsx, and track conversions from actions with the server-side ingest API.

Add the snippet to the `<head>` in `app/root.tsx`:

```tsx
import { Links, Meta, Outlet, Scripts, ScrollRestoration } from '@remix-run/react'

export default function App() {
  return (
    <html lang="en">
      <head>
        <Meta />
        <Links />
        <script defer src="https://privatusanalytics.com/js/pa.js" data-site="pa_YOURSITEID" />
      </head>
      <body>
        <Outlet />
        <ScrollRestoration />
        <Scripts />
      </body>
    </html>
  )
}
```

Client navigations use `history.pushState`, which the tracker follows
automatically.

## Server-side events

Track conversions in an `action` with the
[server-side API](/docs/server-side), forwarding the request's User-Agent
and IP:

```ts
export async function action({ request }: ActionFunctionArgs) {
  // … handle the form …
  await fetch('https://privatusanalytics.com/api/events', {
    method: 'POST',
    headers: {
      Authorization: `Bearer ${process.env.PRIVATUS_INGEST_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      events: [{
        type: 'event', name: 'Signup', url: request.url,
        user_agent: request.headers.get('user-agent'),
        ip: request.headers.get('x-forwarded-for')?.split(',')[0],
      }],
    }),
  })
  return redirect('/welcome')
}
```