Tracking events
An event is anything you want to count: a plan being chosen, a checkout starting, a file being exported. Give it a label and send it from the browser or from your server.
// browser
import { track } from "@vantrex/analytics/client";
track("plan_selected", { plan: "pro" });
// server
await analytics.track("plan_selected", { plan: "pro" });Labels are 1 to 64 characters: letters, digits, spaces and _ . : -. A project can have up to 200 labels; past that, new labels are counted together under other. Elements with data-vtx-track="name" are events too, with that name as the label.
Labels sent from a browser can be made up by anyone who opens your site, so treat counts from the browser as indicative. Events sent from your server with the secret key are the ones to trust for money.
Values and currencies
From your server you can say what an event was worth. Any ISO 4217 currency code is accepted, such as AUD or USD.
await analytics.track("subscription_started", { plan: "team" }, { value: 199, currency: "AUD" });A browser cannot report a value: it is ignored if one is sent, and the event is still counted. Different currencies are never converted into each other; where a dashboard has more than one it shows a separate total for each.
Building a dashboard
- Open Analytics in the sidebar and choose New dashboard. Name it and pick all of your projects or one.
- Add panels with the buttons above the canvas. Drag a panel by its handle to move it and pull its corner to resize it.
- Select a panel to change what it shows. The same panel settings have buttons to move and resize it, so everything can be done from the keyboard.
- Choose Save. The dashboard appears in the sidebar under Analytics.
A dashboard is private to your account and can have up to 20 panels. If you save from an old copy, for example from a second tab, Vantrex refuses the save and asks you to reload, so one tab never silently overwrites another.
Panel types
| Panel | Shows |
|---|---|
| Number | One figure: logins, sign-ups, people online now, or an event's count or total value. |
| Chart | Logins, sign-ups or an event over the dashboard's time range. |
| Event | One event's count with a small chart. |
| Top list | Countries, browsers, operating systems, devices or failure reasons for logins or sign-ups, or your most frequent events. |
| Live map | Who is online right now. |
| Revenue estimate | Event counts times prices you enter. See below. |
Revenue estimates
Say you track plan_pro and plan_basic whenever someone picks a plan. On a revenue panel you list each event with what it is worth, for example Pro at 49 USD and Basic at 9 USD. The panel multiplies how many times each happened in the period by its price and adds them up.
If your server reports a value with an event, that reported value is used for it instead of the price, so you can mix the two. Totals are shown per currency.
Analytics settings
At the bottom of the sidebar, inside Analytics, Analytics settings switches the sidebar to the settings menu. For now it has one page, Dashboards, where you choose which built-in dashboards (Logins, Signups and Active users) show in the sidebar. The built-in ones cannot be edited, only hidden, and a hidden one still opens from its address.
Limits
| What | Limit |
|---|---|
| Dashboards per account | 30 |
| Panels per dashboard | 20 |
| Event labels per project | 200 |
| Prices on one revenue panel | 50 |