Example Application
Complete Next.js integration example.
Full Next.js App Router setup.
1. Install
npm install locallytics better-sqlite32. Setup Database
export DATABASE_URL="./analytics.db"
npx locallytics migrate3. API Route
import { createLocalyticsHandler } from "locallytics";
const handler = await createLocalyticsHandler({
database: process.env.DATABASE_URL!,
});
export const POST = handler.POST;4. Add Tracker
"use client";
import { LocallyticsGrabber } from "locallytics/client";
import { useEffect } from "react";
export default function RootLayout({ children }) {
useEffect(() => LocallyticsGrabber(), []);
return <html><body>{children}</body></html>;
}5. Display Data
import { LocallyticsData } from "locallytics";
export default async function Dashboard() {
const data = await LocallyticsData(process.env.DATABASE_URL!, "last7d");
return (
<div>
<h1>Analytics</h1>
<p>{data.pageviews} pageviews</p>
<p>{data.uniqueVisitors} visitors</p>
<h2>Top Pages</h2>
<ul>
{data.topPages.map((page) => (
<li key={page.page}>{page.page}: {page.count}</li>
))}
</ul>
</div>
);
}CSV Export
import { LocallyticsData } from "locallytics";
export async function GET() {
const csv = await LocallyticsData(process.env.DATABASE_URL!, "last30d", "csv");
return new Response(csv, {
headers: {
"Content-Type": "text/csv",
"Content-Disposition": "attachment; filename=analytics.csv",
},
});
}