Recommended
The fastest way to add Grain is a single script tag. It works on any website, auto-tracks page views, clicks, scroll depth, sessions, and more — no configuration needed.your-tenant-id with your tenant identifier from grainql.com/dashboard.
All Integrations
Grain Tag (Script)
One line of HTML, works on any website. Auto-tracks everything.
React
Use @grainql/tag in React apps.
Next.js
App Router and Pages Router support.
Vue, Svelte & More
Works with any JS framework.
Node.js / Backend
Server-side tracking with @grainql/analytics-web.
Google Tag Manager
No-code setup via GTM.
Shopify
E-commerce tracking for Shopify stores.
WordPress
Plugin or theme integration.
Comparison
| Method | Package | Auto-Tracking | Remote Config | Server-Side |
|---|---|---|---|---|
| Script Tag | @grainql/tag (IIFE) | Yes | No | No |
| npm (React, Next.js, etc.) | @grainql/tag | Yes | No | No |
| npm (Remote Config) | @grainql/analytics-web | No | Yes | No |
| npm (Server-Side) | @grainql/analytics-web | No | Yes | Yes |
| GTM / Shopify / WordPress | Script tag | Yes | No | No |
Which SDK?
There are two Grain SDKs. Here’s how to choose:- Just need analytics, heatmaps, click tracking? Use Grain Tag (
@grainql/tag) via script tag or npm. It auto-tracks everything out of the box. - Need remote config, feature flags, or React hooks? Use Analytics Web (
@grainql/analytics-web). It providesuseConfig,useTrack, and other React hooks, plus remote configuration. - Need server-side event tracking? Use Analytics Web (
@grainql/analytics-web). It supports authenticated server-side calls. - Both browser and server? Use Grain Tag on the frontend for auto-tracking, and Analytics Web on the backend for server-side events.