@ridi/event-tracker
Provides tracking API that helps to send events to various logging services like Google Analytics, RIDI beacon system
Install
NPM
$ npm install @ridi/event-tracker
Browser
<script src="./node_modules/@ridi/event-tracker/dist/umd/bundle.min.js"></script>
Usage
import { Tracker, DeviceType } from "@ridi/event-tracker";
const tracker = new Tracker({
deviceType: DeviceType.PC,
userId: "ridi",
serviceProps: {
"prop1": "value1",
"prop2": "value1"
},
beaconOptions: {
use: true
},
gaOptions: {
trackingId: "UA-XXXXXXXX-X",
pathPrefix: "/PAPERSHOP",
fields: {
contentGroup5: "PAPERSHOP"
}
},
pixelOptions: {
pixelId: "1000000000"
},
tagManagerOptions: {
trackingId: "GTM-XXXX00"
},
kakaoOptions: {
trackingId: "12345678"
},
twitterOptions: {
mainPid: "a1234",
impressionPid: "b1632",
booksSignUpPid: "a1245",
selectStartSubscriptionPid: "z1253",
}
});
tracker.initialize();
tracker.sendPageView(location.href);
tracker.sendEvent("Purchased", {
t_id: "201808180210135",
value: 29000
});
API
new Tracker(MainTrackerOptions)
MainTrackerOptions
Key | Required | Type | Description |
---|---|---|---|
debug |
false | boolean |
Defaults to false If set to true , All fired events are logged to browser via console.log
|
development |
false | boolean |
Represents the state of the system environment your application |
userId |
false | string |
Logged user's identifier. |
deviceType |
true | DeviceType |
Type of connected user's device. Please refer DeviceType type |
serviceProps |
false | ServiceProp |
Additional properties related to specific service. Please refer ServiceProp type, which is Record<string, string>
|
gaOptions |
false | GAOptions |
Options related with Google Analytics tracking module |
gaOptions.trackingId |
true | string |
GA Tracking ID like UA-000000-01 . |
gaOptions.pathPrefix |
flase | string |
Pathname prefix for manual content grouping. |
gaOptions.fields |
false | GAFields |
GA configurable create only fields. |
beaconOptions |
false | BeaconOptions |
Options related with Beacon tracking module |
beaconOptions.use |
false | boolean |
Defaults to true , Specifies whether to send log data to beacon system |
beaconOptions.beaconSrc |
false | string |
Source of the image to be used as a beacon |
pixelOptions |
false | PixelOptions |
Options related with Pixel tracking module |
pixelOptions.pixelId |
true | `string | Array` |
tagManagerOptions |
false | TagManagerOptions |
Options related with Google Tag Manager tracking module |
tagManagerOptions.trackingId |
true | string |
Google Tag Manager Tracking ID like GTM-XXXX00
|
gTagOptions |
false | GTagOptions |
Options related with GTag tracking module |
gTagOptions.trackingId |
true | string |
GTag Tracking ID like AW-XXXX00
|
kakaoOptions.trackingId |
true | string |
Kakao Pixel Tracking ID |
twitterOptions.mainTid |
true | string |
Twitter Pixel universal tag type ID |
twitterOptions.impressionId |
true | string |
ID of impression event tag |
Tracker.initialize()
To use this library correctly, you need to call this method least once either before calling other methods or after.
written event records before calling initialize
, this records flush after initialized.
Tracker.sendPageView(href, referrer)
Key | Required | Type | Description |
---|---|---|---|
href |
true | string | e.g https://example.com/path?key=value#hash
|
referrer |
false | string | e.g https://google.com/search?q=example
|
Tracker.sendEvent(name, data)
Key | Required | Type | Description |
---|---|---|---|
name |
true | string | Indicating what the given event is |
data |
false | object | Data object to be sent with the event. e.g { color: 'red' }
|
Tracker.set(ChangeableTrackerOptions)
Allow to set (change) MainTrackerOptions
's attributes
ChangeableTrackerOptions
Key | Required | Type | Description |
---|---|---|---|
userId |
false | string |
|
deviceType |
false | DeviceType |
Develop
$ git clone https://github.com/ridi/event-tracker && cd tracking
$ npm install
$ npm run build
Test
$ npm run test
Publish
$ npm run deploy
$ # or
$ npm run build && npm publish --access public
LICENSE
MIT