
# React SDK for Aptabase
A tiny SDK (1 kB) to instrument your React apps with Aptabase, an Open Source, Privacy-First and Simple Analytics for Mobile, Desktop and Web Apps.
## Setup
1. Install the SDK using your preferred JavaScript package manager
```bash
npm add @aptabase/react
```
2. Get your `App Key` from Aptabase, you can find it in the `Instructions` menu on the left side menu.
3. Initialize the `AptabaseProvider` component to your app based on your framework.
Setup for Next.js (App Router)
Add `AptabaseProvider` to your RootLayout component:
```tsx
import { AptabaseProvider } from '@aptabase/react';
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
Setup for Next.js (Pages Router)
Add `AptabaseProvider` to your `_app` component:
```tsx
import { AptabaseProvider } from '@aptabase/react';
import type { AppProps } from 'next/app';
export default function App({ Component, pageProps }: AppProps) {
return (
Setup for Remix
Add `AptabaseProvider` to your `entry.client.tsx` file:
```tsx
import { AptabaseProvider } from '@aptabase/react';
import { RemixBrowser } from '@remix-run/react';
import { startTransition, StrictMode } from 'react';
import { hydrateRoot } from 'react-dom/client';
startTransition(() => {
hydrateRoot(
document,
Setup for Create React App or Vite
Add `AptabaseProvider` to your root component:
```tsx
import { AptabaseProvider } from '@aptabase/react';
ReactDOM.createRoot(root).render(
Count: {count}