Skip to content

Analytics

The Analytics app provides a comprehensive dashboard for tracking link performance across the platform. It aggregates click data, unique visitors, geographic distribution, device types, and referral sources for all of a user’s links.

  • Summary stats showing total clicks, unique visitors, top country, and top referrer
  • Time series table displaying daily click and visitor data for the last 30 days
  • Sub-page navigation for detailed breakdowns by geography, device, referrer, and raw click logs
  • Configurable settings for analytics preferences
RoutePurpose
/business/apps/analyticsMain dashboard with stats and 30-day time series
/business/apps/analytics/clicksDetailed click log
/business/apps/analytics/geoGeographic breakdown of traffic
/business/apps/analytics/devicesDevice and browser breakdown
/business/apps/analytics/referrersReferral source breakdown
/business/apps/analytics/settingsAnalytics configuration

The server load function calls two service functions from $lib/apps/analytics/services/index.js:

FunctionParametersDescription
getStats(userId)User IDReturns aggregate stats: total_clicks, unique_visitors, top_country, top_referrer
getTimeSeries(userId, start, end, range, granularity)User ID, date range, granularityReturns time series data; defaults to 30-day range with daily granularity

Each time series data point contains: date, clicks, and unique_visitors.

The dashboard is organized into three sections:

  • Stats grid — four Card components in a responsive 4-column layout, each with an icon and metric label
  • Quick navigation grid — five cards linking to Click Log, Geography, Devices, Referrers, and Settings, each with a colored icon and title
  • Time series table — a full-width HTML table with Date, Clicks, and Unique Visitors columns, rendered inside a Card
  • Cross-app data — analytics data spans shortlinks, biolinks, and other link apps, providing a unified view
  • Service-layer abstraction — the getStats and getTimeSeries functions encapsulate all database queries, making the load function a simple two-call parallel fetch
  • Locale formatting — numbers use toLocaleString() for readable display