npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@metrixorg/websdk-metrix-test

v1.1.7

Published

These instructions will get you setup to use `WebSDK` in your project.

Downloads

5

Readme

Getting Started

These instructions will get you setup to use WebSDK in your project.

install using npm:

npm install @metrixorg/websdk-test

Or add within <script> tag: Place the following <script> inside <head> of your project.

<script src="" type="text/javascript"  crossorigin="anonymous"></script>

Configuration

Initialize Metrix at the start of your application by calling the following method:

import Metrix from '@metrixorg/websdk-metrix-test';

const metrix = new Metrix();

metrix.init('APP_ID', 'API_KEY')

Note: Use Metrix as a singleton instance in your project.

APP_ID: Your application identifier. You can find this id in your Metrix dashboard under Settings > App Info.

API_KEY: You can find this key in dashboard.

API

newEvent

Each interaction that the user has with your application can be introduced as an Event in your dashboard and application in order for Metrix to collect and present its statistics.


newEvent(slug: string, customAttributes: {[key: string]: string}): void

| name | type | description | |:----------------:|:-----------------------------:|:-------------------------------------:| | slug | string | generated event slug in dashboard | | customAttributes | {[key: string: string]} | any custom attribute related to event |

You can use Metrix to track any events in your application. Suppose you want to track every tap on a button. You would have to create a new event in the Events Management section of your dashboard (Settings > Events > Add event) and retrieve the generated slug for the event. The slug is to be used in the application code to send the event to Metrix library. So In your button's onClick method you could then invoke the Metrix newEvent method providing the event slug and optionally some attributes named customAttributes related to the event like the following:

// Send simple event
metrix.newEvent('EVENT_SLUG');

// Send an event with custom attribute
const attributes = {};
attributes['first_name'] = 'Ali';
attributes['last_name'] = 'Bagheri';
attributes['manufacturer'] = 'Nike';
attributes['product_name'] = 'shirt';
attributes['type'] = 'sport';
attributes['size'] = 'large';

metrix.newEvent('EVENT_SLUG', attributes);

setCustomAttribute

setCustomAttribute(key: string, value: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-------------------------:| | key | string | key of custom attribute | | value | string | value of custom attribute |

setFirstName

you can use metrix WebSDK to store user session visiting your application. By this method you can send user first name to metrix library.

setFirstName(firstName: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:---------------:| | firstName | string | user first name |

setLastName

By this method you can send user last name to metrix library.

setLastName(lastName: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:---------------:| | lastName | string | user first name |

setEmail

By this method you can send user email to metrix library.

setEmail(email: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-----------:| | email | string | user email |

setHashedEmail

By this method you can send user hashed email to metrix library.

setHashedEmail(hashedEmail: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-----------------:| | hashedEmail | string | user hashed email |

setPhoneNumber

By this method you can send user phone number to metrix library.

setPhoneNumber(phoneNumber: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-----------------:| | phoneNumber | string | user phone number |

setHashedPhoneNumber

By this method you can send user phone number as hashed phone number to metrix library.

setHashedPhoneNumber(hashedPhoneNumber: string) : void

| Parameter Name | Parameter Type | description | |:-----------------:|:--------------:|:------------------------:| | hashedPhoneNumber | string | user hashed phone number |

setCountry

By this method you can send user country to metrix library.

setCountry(country: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:------------:| | country | string | user country |

setCity

By this method you can send user city to metrix library.

setCity(city: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-----------:| | city | string | user city |

setRegion

By this method you can send user city to metrix library.

setRegion(region: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-----------:| | region | string | user region |

setLocality

By this method you can send user locality to metrix library.

setLocality(locality: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-------------:| | locality | string | user locality |

setGender

By this method you can send user gender to metrix library.

setGender(gender: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-----------:| | gender | string | user gender |

setBirthday

By this method you can send user birthday date to metrix library.

setBirthday(birthday: string) : void

| Parameter Name | Parameter Type | description | |:--------------:|:--------------:|:-------------:| | birthday | string | user birthday |

Additional Features

Session Tracking

Metrix, tracks sessions visiting your website/application and collect data from their activity. types of activity are:

  • duration: session duration time, the time that user is active on your website/application tab by specified session.

    note: The time when the user leaves your website/application tab is not counted as session duration. Therefore, when the user returns to your website/application tab, the duration of the session is calculated from that moment.

  • activityFlow: array of pages address of your website/application that the user has viewed.

Metadata

Metrix, collect metadata from user device, browser and location of user visiting your website/application.

data that is collect from device is:

  • os
  • osVersion
  • deviceLang
  • screen

data that is collect from browser is:

  • browserName
  • browserVersion
  • timezone
  • timezoneOffset

location data is:

  • latitude
  • longitude