@customd/cd-analytics-tracker

Analytics Trackers

This library aims to provide a set of simple, easy to use factory methods to help reduce the boilerplate of writing Analytics Tracking

Installation

Install with Yarn

yarn add cd-analytics-tracker

Or with NPM

npm install --save cd-analytics-tracker

Please Note: You'll need to be registered to https://npm.customd.com to access this module. To do this, run;

npm config set registry https://npm.customd.com

Basic Usage

Within your Router import

import {GoogleAnalytics, FacebookPixel, FullStory, GoogleTags} from 'cd-analytics-tracker'

...

<BrowserRouter>
	<GoogleAnalyticsTracker  options={}/>
	<FacebookPixelTracker options={}/>
	<FullStoryTracker options={}/>
	<GoogleTags options={} />
...
</BrowserRouter>

GoogleTags

• trackingId - required - GoogleTags requires the TrackingId to function correctly

to send events import TrackGoogleTag and use it as TrackGoogleTag(('event', <action>, { 'event_category': <category>, 'event_label': <label>, 'value': <value> }))

GoogleAnalytics

GoogleAnalytics accetps the following options <GoogleAnalytics options={{}}>

• trackingId - (optional) {string} - your analticts tracking id - use this to initialise the tracking library
• debug - (optional) {boolean} - set to true to use the analytics debuggin library (https://developers.google.com/analytics/devguides/collection/analyticsjs/debugging)

additionally you can import {TrackGoogleAnalytics} from 'cd-analytics-tracker' and use it to track any events:

• eg: TrackGoogleAnalytics('send', 'event', 'Videos', 'play', 'Fall Campaign')

Ga tracks each router change and logs a page view for each router change.

FacebookPixel

Accepts trackingId and tracks page views per router change

FullStory

Accepts trackingId for the Organisation and can thereafter be accessed via Window.FS Accepts initialise as an object with UserId & params as keys.

<FullStoryTracker options={
	{
		initialise: {userId,params}
	}
}/>

Contributing

If you find a bug, error or feature that you wish to fix/implement and contribute back to the project, you can do so by committing your work to a new branch, and issuing a merge request.

Once you've created your branch, push it to the repository, and then issue a merge request targeting develop or a release branch.

Make sure you leave a note about why this fix is important, how you found the solution, and any implications this solution might have. Use the merge request template provided.

GitLab will automatically send out an email to the maintainer — that person will then be able to review, test and ensure the change is documented.

The person assigned to the merge will:

• Test the merge request against the develop branch.
• Document the modifications.
• Publish a new release if required, or add to the next release.
• Communicate with the developer who raised the request, and work out if the change needs to be implemented as a hotfix update for earlier major versions.
• Ensure tests have been written, and pass.
• Ensure new features or behaviours have been documented.

Publishing

Ensure you're logged in and registered to npm.customd.com before publishing.

1. Commit and push all changes to a release/xyz branch
2. Run yarn publish
3. Merge and squash changes in to master