bradgarropy / next-google-analytics

📊 google analytics for next.js

📊 next google analytics

Google Analytics 4 for Next.js.

📦 Installation

This package is hosted on npm.

npm install @bradgarropy/next-google-analytics

🥑 Usage

This component integrates Google Analytics 4 into your Next.js website. It downloads and initializes the gtag script, and no further setup is required. In order to work, this component must be placed in the pages/_app.js file.

// pages/_app.js
import GoogleAnalytics from "@bradgarropy/next-google-analytics"

const App = ({Component, pageProps}) => {
    return (
        <>
            <GoogleAnalytics measurementId="G-XXXXXXXXXX" />
            <Component {...pageProps} />
        </>
    )
}

To ensure that Google Analytics is working, you can check a few things.

1. A network request was made to https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX.
2. window.dataLayer exists and includes your Measurement ID.
3. When you navigate your site, items are added to the window.dataLayer array.

📖 API Reference

<GoogleAnalytics>

Name	Required	Default	Example	Description
measurementId	true		"G-XXXXXXXXXX"	Google Analytics Measurement ID.

The example below shows how to use the component.

<GoogleAnalytics measurementId="G-XXXXXXXXXX" />

❔ Questions

🐛 report bugs by filing issues
📢 provide feedback with issues or on twitter
🙋🏼‍♂️ use my ama or twitter to ask any other questions

✨ contributors

Brad Garropy 💻 📖 ⚠️ 🚇