The JavaScript SDK
Important
This article relates to both journy.io's SDKs and Twilio Segment SDKs.
Check out also our journy.io developers documentation -- journy.io API documentation
Topics
journy.io’s JavaScript library lets you record data from your platform, from your JavaScript code.
All of journy.io’s server-side libraries are built for high-performance, so you can use them in your web server controller code. This library uses an internal queue to make identify
and track
calls non-blocking and fast. It also batches messages and flushes asynchronously to journy.io’s servers.
Getting started
Make sure you’re using a version of Node that’s 14 or higher.
Run the relevant command to add journy.io’s Node library module to your
package.json
.npm install @segment/analytics-next
Initialize the
Analytics
constructor the module exposes with your journy.io SDK connector Write Key, like so:import { AnalyticsBrowser } from "@segment/analytics-next"; const analytics = AnalyticsBrowser.load( { writeKey: "YOUR_WRITE_KEY", cdnURL: "https://analyze.journy.io/frontend", // See Proxy }, { integrations: { "Segment.io": { apiHost: "analyze.journy.io/frontend/v1", }, // See Proxy } } );
Be sure to replace YOUR_WRITE_KEY
with your actual Write Key which you can find in journy.io by navigating to: Connections > API/SDK Connector and selecting the source tab and going to the JavaScript tab.
This creates an instance of Analytics
that you can use to send data to journy.io for your project. The default initialization settings are production-ready and queue 20 messages before sending any requests.
There is an option in journy.io to set a proxy ("Use proxy domain") so traffic flows through your own domain. In that case, apiHost
and cdnURL
will have another value, pointing to your own domain.
Basic tracking methods
The basic tracking methods below serve as the building blocks of your journy.io tracking. They include Identify, Group, Track, and Page.
These methods correspond with those used in the journy.io Spec. The documentation on this page explains how to use these methods in JavaScript.
Identify
For any of the different methods described on this page, you can replace the properties and traits in the code samples with variables that represent the data collected.
identify
lets you tie a user to their actions and record traits about them. It includes a unique User ID and/or anonymous ID, and any optional traits you know about them.
journy.io recommends that you make an identify
call:
After a user first registers
After a user logs in
When a user updates their info (for example, they change or add a new address)
Example of an anonymous identify
call:
analytics.identify({
nickname: "web visitor"
friends: 42
});
This call identifies the user and records their unique anonymous ID, and labels them with the friends
trait.
Example of an identify
call for an identified user:
The call above identifies Elon by his unique User ID (the one you know him by in your database), and labels him with the firstname
, lastname
, email
, and friends
traits.
The identify
call has the following fields:
FIELD | TYPE | DESCRIPTION |
| String | The database ID for the user. If you don’t know who the user is yet, you can omit the |
| Object | A dictionary of traits you know about the user, like |
| Object | A dictionary of options. For example, enable or disable specific destinations for the call. Note: If you do not pass a |
| Function | A function executed after a timeout of 300 ms, giving the browser time to make outbound requests first. |
Identifying users happen incremental: You can identify users with a subset of traits
; and later make another identify call with another subset of traits
. The result of both identify calls will be the union of all traits
.
To delete a traits
, you have to add them to the identify
call with value null:
Find details on the identify method payload in journy.io’s Identify Spec.
Group
group
lets you associate an identified user with a group. A group could be a company, organization, account, project or team! It also lets you record custom traits about the group, like industry or number of employees.
journy.io recommends that you make a group
call:
After a user first registers, entering its company details.
After a user logs in. Make a group call for each account the user is part of.
When a user updates their info, make a group call for each account the user is part of.
Example group
call, adding user Elon Musk to account Tesla, as an 'admin':
The group
call has the following fields:
FIELD | TYPE | DESCRIPTION |
| String | The Group ID to associate with the current user. |
| Object | A dictionary of traits for the group. Example traits for a group include |
| Object | A dictionary of options. For example, enable or disable specific destinations for the call. Note: If you do not pass a |
| Function | A function that runs after a timeout of 300 ms, giving the browser time to make outbound requests first. |
Group-calling accounts happen incremental: You can identify users with a subset of traits
; and later make another identify call with another subset of traits
. The result of both identify calls will be the union of all traits
.
To delete a traits
, you have to add them to the group
call with a null reference:
Find more details about group
, including the group
payload, in the journy.io Spec.
Track
track
lets you record the actions your users perform, optionally within the context of an account. Every action triggers what we call an “event”, which can also have associated event metadata.
You’ll want to track events that are indicators of success for your site, like Signed Up, Item Purchased or Article Bookmarked.
To get started, we recommend tracking just a few important events. You can always add more later!
Example identified track
call by a current user:
B2B example identified track
call by a current user (assuming current user being Elon Musk) in the context of account Tesla, back on Dec 12th 2015:
This example track
call tells us that Elon Musk triggered the Car Sold event with a revenue of $39999.99 and chose your hypothetical ‘200-day’ shipping, back on Dec 12th 2015.
track
event properties can be anything you want to record. In this case, revenue and shipping method.
The track
call has the following fields:
FIELD | TYPE | DESCRIPTION |
| String | The name of the event you’re tracking. You can read more about the track method and recommended event names. |
| Object | Optional. A dictionary of properties for the event. If the event was |
| Object | Optional. A dictionary of options. For example, enable or disable specific destinations for the call. Note: If you do not pass a |
| Function | Optional. A function that runs after a timeout of 300 ms, giving the browser time to make outbound requests first. |
Find details on best practices in event naming as well as the track
method payload in the journy.io Spec.
Page
The page
method lets you record page views on your website, along with optional extra information about the page being viewed. It is also user to record screen views in your app/on your platform.
Important Note:
When a
name
is provided in the page call, journy.io will collect those calls and stores them as (app) screen objects.Without name, journy.io regards those calls as (website) page objects.
If you’re using our client-side set up in combination with the JavaScript library, page calls are already tracked for you by default. However, if you want to record your own page views manually and aren’t using our client-side library, read on!
Example page
call, where a current user visits the pricing page:
B2B example page
call, where a user Elon Musk visits the pricing page, when being in account Tesla, back on Dec 12th 2015:
The page
call has the following fields:
FIELD | TYPE | DESCRIPTION |
| String | The category of the page. Useful for cases like ecommerce where many pages might live under a single category. Note: if you pass only one string to |
| String | The name of the page. |
| Object | A dictionary of properties of the page. Note: Analytics.js collects |
| Object | A dictionary of options. For example, enable or disable specific destinations for the call. Note: If you do not pass a |
| Function | A function that runs after a timeout of 300 ms, giving the browser time to make outbound requests first. |
Find details on the page
payload in the journy.io Spec.