Next.js HOC to integrate Google Analytics on every page change
The Next.js team has an official plugin being developed, while plugin supports it’s still in canary only, the way the plugin works it’s simpler than next-ga and I recommend you to check it and do it manually in your project until it’s stable.
Plugin link: https://github.com/zeit/next.js/tree/canary/packages/next-plugin-google-analytics
Next.js High Order Component to integrate Google Analytics on every page change.
Install it
yarn add next-ga
Import it inside your pages/_app.js
;
import Router from "next/router";
import withGA from "next-ga";
Wrap your custom App container with it
// pass your GA code as first argument
export default withGA("UA-xxxxxxxxx-1", Router)(MyApp);
That’s it, now when the user access a page it will log a pageview to Google Analytics, each page change after that will also trigger a pageview on Google Analytics.
Note: This module detects if it’s running in localhost and do nothing there to avoid polluting your analytics with local data.