Product Recommendations

You can integrate Product Recommendations powered by Adobe Sensei into your PWA Studio storefront.

Integration overview

Adobe's Product Recommendations powered by Adobe Sensei is a feature backed by several SaaS services. The Store side includes your PWA storefront, which contains the event collector and recommendations layout template, and the backend, which includes the GraphQL endpoints, SaaS Export module, and the Admin UI.

After you install the Product Recommendations PWA extension on your store, it will start sending behavioral data to Adobe Sensei with no additional setup. Adobe Sensei processes this behavioral data along with the catalog data from the backend and calculates the product associations leveraged by the recommendations service. At this point, the merchant can create and manage recommendation units from the Adobe Commerce Admin UI then fetch those product recommendation units from their PWA storefront.

Install the Product Recommendations module

Install the Product Recommendations Backend module

Next, install an additional backend dependency. Run the following commands to install the backend dependency:

Copy
composer require magento/module-data-services-graphql
Copied to your clipboard
composer require magento/module-data-services-graphql

Copy
magento/experience-platform-connector
Copied to your clipboard
magento/experience-platform-connector

Copy
bin/magento setup:di:compile
Copied to your clipboard
bin/magento setup:di:compile

Copy
bin/magento cache:flush
Copied to your clipboard
bin/magento cache:flush

Install the Product Recommendations Frontend PWA package

Product Recommendations support on PWA requires installing the venia-product-recommendations package and the Product Recommendations module for Adobe Commerce.

1. You can install the PWA venia-product-recommendations package from the NPM registry:

   • For projects cloned from GitHub run the following commands from the project root:

     Copy
     yarn venia add -D @magento/venia-product-recommendations
     Copied to your clipboard
     yarn venia add -D @magento/venia-product-recommendations

     Copy
     yarn venia add -D @magento/venia-data-collector
     Copied to your clipboard
     yarn venia add -D @magento/venia-data-collector

     Copy
     yarn venia add -D @magento/experience-platform-connector
     Copied to your clipboard
     yarn venia add -D @magento/experience-platform-connector

     OR

     Copy
     npm install @magento/venia-product-recommendations
     Copied to your clipboard
     npm install @magento/venia-product-recommendations

     Copy
     npm install @magento/venia-data-collector
     Copied to your clipboard
     npm install @magento/venia-data-collector

     Copy
     npm install @magento/experience-platform-connector
     Copied to your clipboard
     npm install @magento/experience-platform-connector

   • For scaffolded projects run the following commands from project root:

     Copy
       yarn add -D @magento/venia-product-recommendations
     Copied to your clipboard
       yarn add -D @magento/venia-product-recommendations

     Copy
     yarn add -D @magento/venia-data-collector
     Copied to your clipboard
     yarn add -D @magento/venia-data-collector

     Copy
     yarn add -D @magento/experience-platform-connector
     Copied to your clipboard
     yarn add -D @magento/experience-platform-connector

     OR

     Copy
     npm install @magento/venia-product-recommendations
     Copied to your clipboard
     npm install @magento/venia-product-recommendations

     Copy
     npm install @magento/venia-data-collector
     Copied to your clipboard
     npm install @magento/venia-data-collector

     Copy
     npm install @magento/experience-platform-connector
     Copied to your clipboard
     npm install @magento/experience-platform-connector

Create recommendation units

Creating a product recommendation unit for your PWA storefront is the same as creating one for a theme. When you create a recommendation unit in the Admin UI panel, you will need to place components that render product recommendations on appropriate storefront pages. You will do this only once per supported page type.

Render recommendations

To control the recommendation unit placement on your PWA storefront, use the local intercept file. See the extensibility framework documentation to learn more. To render the recommendation unit on your PWA storefront, use one of the methods described below.

Venia UI component

The Recommendations component is part of the venia-product-recommendations package. It contains React components that do the following:

• Collect and send behavioral data to Adobe Sensei
• Fetch recommendations from the recommendations service
• Render the recommendation unit to your storefront page

Example

Copy
//Render recommendations using visual component
import {
  VeniaProductRecommendations,
  PageTypes,
} from "@magento/venia-product-recommendations";

return <VeniaProductRecommendations pageType={PageTypes.CMS} />;
Copied to your clipboard
//Render recommendations using visual component
import {
  VeniaProductRecommendations,
  PageTypes,
} from "@magento/venia-product-recommendations";

return <VeniaProductRecommendations pageType={PageTypes.CMS} />;

Fetch data only

If you are not using the venia-product-recommendations package, you can call the recommendations service and receive a JSON payload.

Example

Copy
import { PageTypes } from "@magento/venia-product-recommendations";
import useRecsData from "@magento/venia-product-recommendations/lib/hooks/useRecsData";

const { data, error, isLoading } = useRecsData({ pageType: PageTypes.CMS });
Copied to your clipboard
import { PageTypes } from "@magento/venia-product-recommendations";
import useRecsData from "@magento/venia-product-recommendations/lib/hooks/useRecsData";

const { data, error, isLoading } = useRecsData({ pageType: PageTypes.CMS });

Support Policy

Supported Versions

Support is currently provided for version 14.0.1 and above. This includes:

• Bug fixes
• Technical support and troubleshooting

Upgrade Recommendation

To receive continued support, please ensure your environment is updated to version 14.0.1 or later. Refer to the official upgrade documentation for guidance on updating safely.

Contact & Assistance

If you have questions about version support or need help upgrading, please contact the support team or open a support request through the appropriate support channel.

Last updated 9/2/2025

Was this helpful?

Yes

No