analytics

Functions and components for Google Analytics to work with React. You need to have React-GA to work with these functions.

If you want to know how to configure the Google Analytics, check our guide

Installation#

npm install @iqmetrix/analytics

Basic Usage#

Normally we will initializate the ReactGA on our index.tsx using the id generated.

import ReactGA from "react-ga";
ReactGA.initialize("UA-000000-01"); // replace this with your UA id
// OR ReactGA.initialize('UA-000000-01', { debug: true }); to enable debug

For more API examples check the React-GA repo

Tracking with Routes (react-router or react-dom-router)#

Using SPA (Single Page Application) with a shell creates some challenges to track pages/routes changes correctly. To automatically track the page view every time to go to a new route, you could use the function withGARouter along with your <Router>.

import { withGARouter } from "@iqmetrix/analytics";
import { HashRouter as Router, Route, Switch } from "react-router-dom";
import { Page1, Page2 } from "./pages";
import { Result } from "@iqmetrix/antd";
const App = () => {
return (
<Router>
<Switch>
<Route exact path={"/"} component={withGARouter(Page1)} />
<Route exact path={"/:guid"} component={withGARouter(Page2)} />
<Route component={() => <Result status="404" />} />
</Switch>
</Router>
);
};

Sources#

Last updated on by Paulo Andrade