# MIRA FIVE in your React Router app.

> Add MIRA FIVE to your React Router app with a coding-agent prompt, or one tag in app/root.tsx. Then ask which visits, ads and channels bring sales.

URL: https://mirafive.io/install/react-router

[Install](https://mirafive.io/install)React Router / Remix

Add one line to your React Router app, or give a ready prompt to your coding agent. Then ask in plain words which visits, ads and channels bring sales.

## How do I add analytics to my React Router app?

Give your coding agent this prompt. It says where the tag goes and which line to add.

The example shows `acme.example` and a key that starts with `pk_live_`. The app writes both for your site.

Prompt for your coding agent

```
Add the MIRA FIVE analytics script to my website acme.example (React Router / Remix).

This is a React Router (Remix) app. Add the tag inside <head> in app/root.tsx, next to <Meta /> and <Links />:

<script async src="https://cdn.mirafive.io/s.js" data-key="pk_live_…" crossorigin="anonymous"></script>

Rules:
- Use the values exactly as given; do not change data-key.
- Load it once on every page, not inside a component that renders more than once.
- Without the visitor's consent it stores nothing on the device; do not add cookies or storage for it.
- If the site sends a Content-Security-Policy, allow script-src https://cdn.mirafive.io and connect-src https://collect.mirafive.io.

When it is deployed, open https://acme.example once in a browser so Mira can confirm the first visit.
```

Script tag

Add the tag inside <head> in app/root.tsx, next to <Meta /> and <Links />:

```
<script async src="https://cdn.mirafive.io/s.js" data-key="pk_live_…" crossorigin="anonymous"></script>
```

## What happens after I add it?

Open https://acme.example once after the tag is live. Mira confirms the first visit in the chat within a few seconds.

Mira

Your first visit just arrived: someone opened /pricing in Safari. From now on I record every visit to acme.example, and the site overview shows who is on it right now and today.

Then ask in plain words, for example

- How many visitors did acme.example have today?
- Where did my visitors come from last week?
- Which pages got the most views this week?

## What does the script do on my site?

Size

The script is under 3 KB.

Loading

It loads with async, so it never holds up your page.

Cookies

It sets no cookie. It stores nothing on the visitor's device without statistics consent.

IP address

The IP address is never stored.

Security policy

If the site sends a Content-Security-Policy, allow script-src https://cdn.mirafive.io and connect-src https://collect.mirafive.io.

What a setup collects, and why, decides whether it is lawful. A tool does not decide it.

## Another stack?

- [Next.js](https://mirafive.io/install/nextjs)
- [Nuxt](https://mirafive.io/install/nuxt)
- [Astro](https://mirafive.io/install/astro)
- [SvelteKit](https://mirafive.io/install/sveltekit)
- [Gatsby](https://mirafive.io/install/gatsby)
- [Vite](https://mirafive.io/install/vite)
- [WordPress](https://mirafive.io/install/wordpress)
- [Shopify](https://mirafive.io/install/shopify)
- [Webflow](https://mirafive.io/install/webflow)
- [Framer](https://mirafive.io/install/framer)
- [Wix](https://mirafive.io/install/wix)
- [Squarespace](https://mirafive.io/install/squarespace)
- [Lovable](https://mirafive.io/install/lovable)
- [Bolt](https://mirafive.io/install/bolt)
- [v0](https://mirafive.io/install/v0)
- [Static HTML](https://mirafive.io/install/html)

## Start with one line.

Create your account, then add the line to your React Router app.

[Try it free](https://app.mirafive.io/login)
