Installation

By default, Alokai integration for Bloomreach Content is meant to be used as a Storefront module. However, it can also be installed in any Next or Nuxt application.

Requirements

• Next or Nuxt frontend with Alokai SDK installed (latest version),
• Server Middleware application (latest version),
• Bloomreach Content environment,
• Node.js version 18.x,
• @vsf-enterprise NPM registry access.

Installing dependencies

In your frontend application, install the following dependencies:

yarn add @bloomreach/spa-sdk @vsf-enterprise/bloomreach-content-sdk

In your Server Middleware application, install the following dependencies:

yarn add @vsf-enterprise/bloomreach-content-api

Configuring Server Middleware

The next step is configuring the Bloomreach Content integration in the Server Middleware.

Add the following configuration to your Server Middleware configuration file. Replace <bloomreach_environment_name> with the name of your Bloomreach Content environment (e.g. vuestorefront):

import type { Integration } from "@vue-storefront/middleware";
import type { MiddlewareConfig as BloomreachContentMiddlewareConfig } from "@vsf-enterprise/bloomreach-content-api";

export default {
  integrations: {
    bloomreachContent: {
      location: '@vsf-enterprise/bloomreach-content-api/server',
      configuration: {
        environment: '<bloomreach_environment_name>',
      },
    } satisfies Integration<BloomreachContentMiddlewareConfig>,
  },
}

Configuring Alokai SDK

The last step in the process is configuring Alokai SDK for Bloomreach Content in your frontend application.

Add the following configuration to your Alokai SDK configuration file:

import { bloomreachContentModule } from '@vsf-enterprise/bloomreach-content-sdk';

export function getSdkConfig() {
  return defineSdkConfig(({ buildModule, config }) => ({
    bloomreachContent: buildModule(bloomreachContentModule, {
      apiUrl: `${config.middlewareUrl}/bloomreachContent`
    }),
  }));
}