add-analytics

Integrate Google Analytics 4 into Next.js with RGPD-compliant cookie consent.

34|6|Updated Jun 30, 2026
One-click install
npx skills add https://github.com/flavien-ia/hypervibe-harness --skill add-analytics-flavien-ia
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: add-analytics
Source: https://github.com/flavien-ia/hypervibe-harness/tree/main/skills/add-analytics
Command: npx skills add https://github.com/flavien-ia/hypervibe-harness --skill add-analytics-flavien-ia

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This skill solves the complexity of integrating Google Analytics 4 while ensuring strict compliance with RGPD regulations, preventing unauthorized tracking and data pollution from internal admin traffic.

Core Features & Use Cases

  • RGPD-Compliant Consent: Automatically deploys a cookie banner that blocks tracking until explicit user consent is granted.
  • Smart Traffic Filtering: Automatically excludes admin and authenticated user routes from analytics to ensure data accuracy.
  • Automated Setup: Configures environment variables, creates React components, and updates legal documentation in one workflow.

Quick Start

Run the add-analytics skill to integrate Google Analytics into this project and set up the cookie consent banner.

Frequently Asked Questions about add-analytics

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

FAQPage Schema
How do I add Google Analytics 4 to a Next.js app with RGPD-compliant consent?

Adding Google Analytics 4 to Next.js with RGPD compliance requires deploying a cookie banner that blocks tracking scripts until users grant explicit permission, ensuring regulatory compliance while maintaining accurate traffic measurement and filtering internal admin routes.

Does Google Analytics 4 tracking require a cookie consent banner for RGPD?

Yes, Google Analytics 4 tracking requires a cookie consent banner for RGPD compliance to prevent unauthorized tracking. The mechanism blocks analytics scripts from loading until explicit user consent is granted, protecting visitor privacy.

How do I exclude admin and authenticated user traffic from Google Analytics?

Excluding admin traffic from Google Analytics involves configuring route-based filtering to prevent authenticated internal sessions from polluting analytics data, ensuring data accuracy for external visitor behavior.

Do I need pnpm and Node.js to configure Google Analytics in a Next.js project?

Configuring Google Analytics in Next.js requires Node.js and pnpm installed locally, alongside access to Vercel or local environment configuration to manage environment variables for seamless deployment.

What is the best way to manage Google Analytics environment variables in Next.js?

The best way to manage Google Analytics environment variables in Next.js is through an automated setup that configures local and Vercel environments. This workflow creates React tracking components and updates privacy documentation simultaneously.