MuseMVP

MuseMVP Base: Next.js for Node and Cloudflare. MuseMVP Flare: an AI SaaS template that runs entirely on Cloudflare. Authentication, billing and administration included.

Product
  • Home
  • Pricing
  • Templates
Resources
  • Docs
  • Blog
  • Changelog
Legal
  • Privacy
  • Terms
  • Community
Open-Launch Top 1 Daily WinnerOpen-Launch Top 1 Daily WinnerVerified DR - Verified Domain Rating for musemvp.comVerified DR - Verified Domain Rating for musemvp.comMuseMVP - Featured on Startup FameMuseMVP - Featured on Startup FameFazier badgeFazier badgeLiftOff award badgeLiftOff award badge

© 2026 MuseMVP. All rights reserved.

MuseMVP
  • Pricing
  • Docs
  • Blog
  • Changelog
Buy All in One
MuseMVP Docs
MuseMVP Docs
OverviewTech StackQuick Start
Project Structure
EmailObject Storage
Internationalization
SEOAnalytics

Analytics

Configure analytics script injection and event tracking.

MuseMVP integrates Google Analytics (GA4) and Baidu Tongji, with a unified useAnalytics hook that sends custom events to both platforms. Suitable for products targeting both international and Chinese markets.

Injection Strategy

src/modules/analytics/index.tsx
src/modules/html-document/Document.tsx
packages/config
FilePurpose
src/modules/analytics/index.tsxAnalyticsScript and useAnalytics hook
src/modules/html-document/Document.tsxMount point for AnalyticsScript
packages/configconfig.analytics source

Configuration

// packages/config
analytics: {
  googleAnalyticsId: "G-XXXXXXXXXX",  // GA4 measurement ID
  baiduTongjiId: "",                   // Baidu Tongji ID; leave empty to skip
}
  • Google Analytics: Uses @next/third-parties GoogleAnalytics component
  • Baidu Tongji: Injected via next/script with dynamic script

Development Behavior

  • In development (NODE_ENV === "development"), analytics scripts are not injected
  • Console logs [AnalyticsScript] local development, skip analytics.
  • Keeps dev and test traffic out of production data

Event Tracking

Use useAnalytics() to send custom events:

import { useAnalytics } from "@/modules/analytics";

function MyComponent() {
  const { trackEvent } = useAnalytics();

  const handleClick = () => {
    trackEvent("button_click", { button_id: "pricing_cta", page: "home" });
  };

  return <button onClick={handleClick}>Upgrade</button>;
}

Events are sent to:

  • gtag (Google Analytics)
  • _hmt (Baidu Tongji, when baiduTongjiId is set)

SSR Safety

trackEvent checks typeof window !== "undefined" and does nothing during SSR.

Pre-Launch Checklist

Verify production analytics IDs: googleAnalyticsId and baiduTongjiId should be production IDs.

Confirm scripts load after hydration: use browser Network tab.

Validate key conversion events with Google Analytics Debugger or Baidu real-time reports.

Related Docs

  • SEO — Sitemap, metadata, search optimization
  • Tech Stack — Analytics integration

SEO

Best practices and implementation guidance for optimizing your application for search engines.

IDE and Toolchain

Node 22, pnpm, Biome, and portable agent entry points.

On this page

Injection StrategyConfigurationDevelopment BehaviorEvent TrackingPre-Launch ChecklistRelated Docs

One payment. Tax included.

All in One

Base, Flare and every UI template, plus new ones.

$129

Buy All in One