skills.rest
jpmoya
jpmoyaCOMMUNITY
Explore all skills by this author →
GitHub

integration-nextjs-pages-router

Integrates PostHog analytics, error tracking, and user identification into Next.js Pages Router applications.

Updated Sep 1, 2026
Search Tags:#analytics#nextjs#event tracking#error tracking#posthog#user identification#pages router
One-click install
npx skills add https://github.com/jpmoya/claude-agents --skill integration-nextjs-pages-router-jpmoya
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: integration-nextjs-pages-router
Source: https://github.com/jpmoya/claude-agents/tree/main/skills/integration-nextjs-pages-router
Command: npx skills add https://github.com/jpmoya/claude-agents --skill integration-nextjs-pages-router-jpmoya

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires posthog-js, posthog-node, and includes references (resource) components.

What problem does it solve? Adding product analytics to a Next.js Pages Router app requires correct client initialization, server-side event capture, user identification, and error tracking across many files, which is easy to get wrong or leave incomplete. ## Core Features & Use Cases - Guided four-phase integration: Analyzes the project, plans events in .posthog-events.json, implements capture calls, then reviews, lints, and reports the results. - Client and server coverage: Initializes posthog-js via instrumentation-client.ts, adds server-side capture with posthog-node in API routes, and correlates both with matching distinct IDs. - User identification and error tracking: Adds posthog.identify() on login/signup, reset() on logout, and captureException around critical flows. - Use Case: Point the skill at an existing Next.js Pages Router codebase and receive instrumented event tracking, a PostHog dashboard with insights, and a setup report listing every event added. ## Quick Start Add PostHog analytics, user identification, and error tracking to my Next.js Pages Router project following the example patterns.

Frequently Asked Questions about integration-nextjs-pages-router

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add PostHog analytics to a Next.js Pages Router app?▼

Initialize posthog-js in instrumentation-client.ts with your project token and host, then call posthog.capture in event handlers. For server-side tracking, use posthog-node in API routes with flushAt set to 1 and call shutdown after capturing.

How to identify users with PostHog in Next.js?▼

Call posthog.identify with a unique distinct ID right after login or signup, passing person properties like username. On logout, call posthog.reset so future events on shared devices are not linked to that user.

Does PostHog work with Next.js Pages Router API routes?▼

Yes, API routes under src/pages/api can use the posthog-node SDK to capture server-side events and identify users. Pass the client-side distinct ID via headers like X-POSTHOG-DISTINCT-ID to correlate frontend and backend events.

Should I use instrumentation-client.ts or PostHogProvider in Next.js?▼

For Next.js 15.3 and later, initialize PostHog in instrumentation-client.ts and never combine it with a PostHogProvider component. The instrumentation file is the correct client-side initialization approach for both Pages and App Router.

Why set up a reverse proxy for PostHog in Next.js?▼

A reverse proxy via Next.js rewrites routes ingestion through your own domain, such as /ingest, making tracking requests less likely to be blocked by ad blockers. It requires skipTrailingSlashRedirect set to true in next.config.

Related Skills

Explore More Software Engineering Skills→
FrekiManagarmFrekiManagarm

error-tracking-nextjs

Integrate PostHog error tracking into Next.js applications with source maps.

Community
Intermediate
DojoCodingLabsDojoCodingLabs
2

posthog-analytics

Create PostHog dashboards and run HogQL queries for analytics, funnel, and cohort reporting.

Official
Intermediate
vitoropereiravitoropereira

posthog

Integrate PostHog analytics, feature flags, and session replay into Next.js applications.

Community
Intermediate
EthGlobalBangkokEthGlobalBangkok
1

integration-nextjs-app-router

Integrate PostHog analytics into Next.js App Router with client and server instrumentation.

Official
Intermediate