dha-analytics

A module for implementing Google Measurement Protocol into PWA apps that were
created with DHA SDK pwa-starter and/or create-react-app.

A Note About Version 3.0

While 3.0 should still be compatible with the PWA Starter using Create React App, A change in the way you import enviornment variables was made to align with the new Tailwind starter, if you encounter any issues with it please revert to 2.0 of dha-analytics.

Getting Started

#### Install

Install from npm:

- npm i dha-analytics

#### Google Analytics Account

- You must have a Google Analytics account setup before using this package.

#### Analytics Module

##### .env config

- Create a ".env or .env.development" file at the root of your application with parameters that are
sent with every request to GA. Note: "REACT_APP_TRACKER_XYZ" becomes "xyz" when passed to GA:

- See Google Analytics for complete parameter reference:

Tailwind Starter:

``


Required params:

VITE_TRACKER_AIP=1
`

CRA Starter:

`


Required params:

REACT_APP_TRACKER_AIP=1
`

Home.tsx - Functional component

`javascript
import { Button } from '@material-ui/core';
import { Tracker } from 'dha-analytics';
import React, { useEffect } from 'react';

const Home = () => {
const path = window.location.hash;
const tracker = Tracker();

useEffect(() => {
tracker({ dh: 'example.com', dp: path, dt: 'App', t: 'pageview' });
});

const handleClick = (event: React.ChangeEvent<{}>) => {
tracker({
dp: path,
ea: 'handleClick',
ec: 'click',
el: 'clickButton',
ev: '1',
t: 'event',
});
};

return (

Click

);
};

export default Home;
`

Home.tsx - Class component

`js
import { Button } from '@material-ui/core';
import { Tracker } from 'dha-analytics';
import React from 'react';

class Home extends React.Component {
private path = window.location.hash;
private tracker = Tracker();

componentDidMount(): void {
this.tracker({ dh: 'example.com', dp: this.path, dt: 'App', t: 'pageview' });
}

handleClick = (event: React.ChangeEvent<{}>) => {
this.tracker({
dp: this.path,
ea: 'handleClick',
ec: 'click',
el: 'clickButton',
ev: '1',
t: 'event',
});
};

render() {
return (

Click

);
}
}

export default Home;
``

Contribute

_see Github wiki_

NPM

License

_pending_