Amplitude Build Tutorials
Ship Amplitude in your stack
Copy-paste tutorials for every framework and coding agent. Complete files, checked against the docs, with a prompt you can hand straight to Cursor or Claude Code.
Featured
Chris Tam · 15 min
How to add web analytics to a Next.js app
Configure the Amplitude Unified SDK so every App Router navigation becomes a page view, every visit carries its UTM and referrer data, and sessions feed bounce rate and session length. Then open the Marketing Analytics views that read those events. About 15 minutes, all copy-paste.
Chris Tam · 15 min
How to add session replay to a Next.js app
Install the Amplitude Unified SDK in a Next.js App Router project, start session replay once on the client with a sample rate you choose, mask what shouldn't leave the browser, and confirm a replay lands. About 15 minutes, all copy-paste.
All tutorials
14 tutorials · newest first
How to add product analytics to a Next.js app
Install the Amplitude Unified SDK in a Next.js App Router project, identify signed-in users, track one custom event from a click and one conversion from a server action, and confirm both land on the same user. About 15 minutes, all copy-paste.
- Next.js 13+
- App Router
- Unified SDK 1.x
- Node SDK 1.x
Chris Tam
15 min · 29 Sept 2026
Bootstrap flags on the server for first paint
Evaluate flags on the server, pass them to the Experiment client SDK as initialVariants, and render client components with the right variant in the first HTML, with no loading state and no swap after hydration. About 15 minutes, all copy-paste.
- Next.js 13+
- App Router
- Experiment JS SDK 1.x
- initialVariants
Chris Tam
15 min · 25 Sept 2026
How to add agent analytics to a Next.js app
Install the Amplitude AI SDK on the server side of a Next.js app, wrap an LLM route handler in an agent session, link it to the user's browser session, and flush before the function freezes. About 20 minutes, all copy-paste.
- Next.js 15+
- App Router
- Amplitude AI SDK
Chris Tam
20 min · 25 Sept 2026
How to add feature flags and experiments to a Next.js app
Create a client deployment and a feature flag in Amplitude, initialize Feature Experiment in the Next.js App Router, read the variant in a client component, and confirm the exposure lands on the right user. About 15 minutes, all copy-paste.
- Next.js 13+
- App Router
- Unified SDK 1.x
- Feature Experiment
Chris Tam
15 min · 25 Sept 2026
How to add guides and surveys to a Next.js app
Install the Amplitude Unified SDK in a Next.js App Router project, let it boot guides and surveys once on the client, route guide links through the Next.js router, identify signed-in users so targeting works, and open a survey from your own button. About 20 minutes, all copy-paste.
- Next.js 13+
- App Router
- Unified SDK 1.x
Chris Tam
20 min · 25 Sept 2026
How to add heatmaps to a Next.js app
Install the Amplitude Unified SDK with session replay on, initialize it once on the client, give each App Router view its own URL, and create a click map for a dynamic route. About 15 minutes of setup, then heatmaps fill in as traffic arrives.
- Next.js 13+
- App Router
- Unified SDK 1.x
- Session Replay plugin 1.7+
Chris Tam
15 min · 25 Sept 2026
How to add session replay to a Next.js app
Install the Amplitude Unified SDK in a Next.js App Router project, start session replay once on the client with a sample rate you choose, mask what shouldn't leave the browser, and confirm a replay lands. About 15 minutes, all copy-paste.
- Next.js 13+
- App Router
- Unified SDK 1.x
Chris Tam
15 min · 25 Sept 2026
How to add web analytics to a Next.js app
Configure the Amplitude Unified SDK so every App Router navigation becomes a page view, every visit carries its UTM and referrer data, and sessions feed bounce rate and session length. Then open the Marketing Analytics views that read those events. About 15 minutes, all copy-paste.
- Next.js 13+
- App Router
- Unified SDK 1.x
Chris Tam
15 min · 25 Sept 2026
How to add web experiment to a Next.js app
Load the Amplitude Web Experiment script in your Next.js root layout so variants render before the page paints, keep analytics in the npm SDK you already have, and confirm [Experiment] Impression events land. About 15 minutes, and most of it is one <script> tag.
- Next.js 13+
- App Router
- Web Experiment script
Chris Tam
15 min · 25 Sept 2026
Track events from React Server Components
Move Amplitude tracking out of Server Component render and into server actions and route handlers, pass the browser's device ID and your user ID to the Node.js SDK, and flush before each request ends. About 15 minutes, all copy-paste.
- Next.js 14+
- App Router
- Node SDK 1.x
Chris Tam
15 min · 25 Sept 2026
Use feature flags with server-side rendering in Next.js
Evaluate an Amplitude feature flag on the server with the Experiment Node server SDK, give the server the same device ID the browser uses, and render the variant in the first HTML, either from a Server Component or from a client component bootstrapped with initialVariants. Exposures go out only after the variant is on screen.
- Next.js 13+
- App Router
- Experiment Node SDK 1.x
- Experiment JS SDK 1.x
- Local evaluation
Chris Tam
25 min · 25 Sept 2026
How to add analytics to your app with Codex CLI
Connect Codex CLI to Amplitude's MCP servers, hand it one prompt that installs the right SDK for your stack, review the diff for the mistakes agents make, and save the rules in AGENTS.md so later edits follow them. About 15 minutes, all copy-paste.
- Codex CLI
- Amplitude MCP
- Docs MCP
- AGENTS.md
Chris Tam
15 min · 24 Sept 2026
How to add product analytics to a Node.js backend
Install the Amplitude Node.js SDK in an Express backend, attach the right user or device ID to every server event, and flush the queue before the process exits. About 15 minutes, all copy-paste.
- Node 20.6+
- Express
- Node SDK 1.x
Chris Tam
15 min · 24 Sept 2026
How to add product analytics to a React app
Install the Amplitude Unified SDK in a Vite and React Router app, capture page views on every client-side navigation, identify signed-in users, and track one custom event. About 10 minutes, all copy-paste.
- React 18+
- Vite
- React Router
- Unified SDK 1.x
Chris Tam
10 min · 24 Sept 2026
Get an API key and start shipping
A free account covers almost every tutorial here. For the full SDK reference, head to the docs.