Personalized recommendations

We want to add experimental support for personalized recommendations, using Algolia Personalization "Classic"

This is an experimental UI library implementation that stitches together existing APIs.

A reference guide will also be shared for users who want to implement this in the flavor of their choice.

How to use

To enable personalisation with recommend, you'll need to import from /experimental-personalization like the following:

JavaScript

import { trendingItems } from '@algolia/recommend-js/dist/esm/experimental-personalization';

trendingItems({
  region: 'eu', // "eu" | "us"
  userToken: 'user_token',
  indexName: "indexName"
  // ...

Or by using a standalone endpoint:

<script src="https://cdn.jsdelivr.net/npm/@algolia/recommend-js/dist/umd/experimental-personalization/index.js"></script>

React

import { TrendingItems } from '@algolia/recommend-react/dist/esm/experimental-personalization';

<TrendingItems
  region="eu" // "eu" | "us"
  userToken="user_token"
  indexName="indexName"
  // ...

Or by using a standalone endpoint:

<script src="https://cdn.jsdelivr.net/npm/@algolia/recommend-react/dist/umd/experimental-personalization/index.js"></script>

We avoid using the pre-existing queryParameters for userToken to avoid unexpected side-effects as well as possible semantic-versioning headaches if/when personalized recommendations is supported by the Recommend API and the experimental parameter is removed.

Parameters

The following parameters are all required for personalization:

region : Personalization data is stored and processed in a specific region. You can check the region for your account in the Algolia dashboard.
userToken : Associates a certain user token with the current query learn more
suppressExperimentalWarning: (optional) boolean parameter to disable the experimental console warning message.

Notes

When using recommend-react: if the Recommend context is used for batching, the userToken passed to the component take precedence over the one passed to the context. (ie if you pass 2 different user-tokens between the context provider and the recommend component, the one from the component is used)
When using the <Recommend> React context provider, you will need to import all the components from /experimental-personalization.
Caching is proposed in a stacked PR https://github.com/algolia/recommend/pull/175

algolia / recommend

feat: Add Personalized Recommendations (experimental) #174