Skip to main content

Why use JSON output?

The Client-Side Script and Server-Side SDK both deliver rendered HTML (or images) that you inject into your page. This is ideal when Reelevant controls both the logic and the visual output. But sometimes you want Reelevant to handle the personalisation decisions while your own frontend handles the rendering. That’s what the JSON API approach gives you.

Full rendering control

You receive structured data — product names, prices, scores, URLs — and render them with your own components, design system, or native UI.

Framework-agnostic

Works with React, Vue, Svelte, Flutter, iOS, Android, or any client that can make an HTTP request and parse JSON.

Typed & predictable

JSON Templates define a schema upfront. Your frontend knows exactly what fields to expect — no guessing, no parsing HTML.

Same personalisation engine

All the power of Reelevant workflows — datasources, conditions, splits, real-time testing — just with JSON output instead of visual content.

When to choose this approach

ScenarioRecommended
You have a design system and want personalised data, not HTMLJSON API
Mobile app that renders nativelyJSON API
Headless CMS or composable architectureJSON API
You want Reelevant to produce ready-to-display visualsClient-Side Script or Server-Side SDK
Quick integration, no development effortClient-Side Script + Browser Extension

How it works

1

Create a JSON Template

In the Reelevant platform, create a JSON Template that defines the schema (fields and types) and declares named variables. Each variable maps to a datasource value that will be resolved at runtime.
2

Build a workflow with a JSON Template output node

Add a JSON Template output node to your workflow. Select the template you created, and bind each variable to a datasource field — either as a scalar value or as an array (for product lists, recommendations, etc.).
3

Publish the workflow

Publishing validates that all JSON Template nodes reference the same template and that the template exists. Once published, the workflow is live.
4

Call the runner endpoint

Your application makes a simple HTTP GET request to the Reelevant runner. The response is a JSON object matching your template schema — with all variables resolved to real-time personalised data.

Example

Suppose you want to personalise a product recommendation card. Your JSON Template definition might look like:
{
  "headline": { "type": "static", "value": "Recommended for you" },
  "productName": { "type": "dependency", "variable": "productName" },
  "productPrice": { "type": "dependency", "variable": "productPrice" }
}
Each field is either a static value (fixed at design time) or a dependency (a named variable resolved from your datasources at runtime). At runtime, the Reelevant engine resolves each dependency — so each visitor sees the product most relevant to them. The response is a flat JSON object:
{
  "headline": "Recommended for you",
  "productName": "Running Shoes Pro",
  "productPrice": 129.99
}
Your frontend simply renders the JSON fields using its own components.

Next steps

Technical Integration

API endpoints, request format, response structure, and code examples.

JSON Template (Output Node)

Learn about the JSON output node configuration in the workflow editor.