Skip to main content
Version: 3.x

Magento 1

This extension contains the connector to use Front-Commerce with a headless Magento 1 backend.

Prerequisites

Install the module on Magento.

Installation

First ensure you have installed the package:

$ pnpm install @front-commerce/magento1@latest

Setup Magento1 Extension

Update your front-commerce.config.ts to include the Magento1 Extension :

front-commerce.config.ts
import { defineConfig } from "@front-commerce/core/config";
import themeChocolatine from "@front-commerce/theme-chocolatine";
import magento1 from "@front-commerce/magento1";
import storesConfig from "./app/config/stores";
import cacheConfig from "./app/config/caching";

export default defineConfig({
extensions: [magento1({ storesConfig }), themeChocolatine()],
stores: storesConfig,
cache: cacheConfig,
configuration: {
providers: [],
},
v2_compat: {
useApolloClientQueries: true,
useFormsy: true,
},
pwa: {
appName: "Front-Commerce",
shortName: "Front-Commerce",
description: "My e-commerce application",
themeColor: "#fbb03b",
icon: "assets/icon.png",
maskableIcon: "assets/icon.png",
},
});

Add the following variables to your .env file:

.env
FRONT_COMMERCE_MAGENTO1_ENDPOINT=https://magento1.example.com
FRONT_COMMERCE_MAGENTO1_CONSUMER_KEY=xxxxxxxxx
FRONT_COMMERCE_MAGENTO1_CONSUMER_SECRET=xxxxxxxxx
FRONT_COMMERCE_MAGENTO1_ACCESS_TOKEN=xxxxxxxxx
FRONT_COMMERCE_MAGENTO1_ACCESS_TOKEN_SECRET=xxxxxxxxx

Feature Flags

The Magento 1 extension supports the following feature flags: Click to expand.
  • Cart (default: true) - Enable the cart feature
  • Catalog (default: true) - Enable the catalog feature
  • Checkout (default: true) - Enable the checkout feature
  • Cms (default: true) - Enable the CMS feature
  • CmsSearch (default: true) - Enable the CMS search feature
  • Configuration (default: true) - Enable the Configuration feature
  • Contact (default: true) - Enable the contact feature
  • Customer (default: true) - Enable the customer feature
  • DownloadableProduct (default: true) - Enable the downloadable product feature
  • InStockAlert (default: true) - Enable the in stock alert feature
  • Invoice (default: true) - Enable the invoice feature
  • MagentoAdmin (default: true) - Enable the Magento admin feature
  • Order (default: true) - Enable the order feature
  • Refund (default: true) - Enable the refund feature
  • Reviews (default: true) - Enable the reviews feature
  • Store (default: true) - Enable the store feature
  • Wishlist (default: true) - Enable the wishlist feature
  • Wysiwyg (default: true) - Enable the WYSIWYG feature

All these features are active by default. To disable a feature you should return a falsy value for the feature flag in your extension options:

front-commerce.config.ts
import { defineConfig } from "@front-commerce/core/config";
import themeChocolatine from "@front-commerce/theme-chocolatine";
import magento1 from "@front-commerce/magento1";
import storesConfig from "./app/config/stores";
import cacheConfig from "./app/config/caching";

export default defineConfig({
extensions: [
magento1({
storesConfig
features: {
Contact: false, // Contact feature will be disabled
Refund: false, // Refund feature will be disabled
Reviews: false, // Reviews feature will be disabled
// all other features will be enabled by default
},
}),
themeChocolatine(),
],
stores: storesConfig,
cache: cacheConfig,
configuration: {
providers: [],
},
});
tip

If a feature is not defined in the feature flags, it will be enabled by default.

Disable Health Checks

By default, Front-Commerce enables Health Checks to monitor the availability of the Magento1 backend. These checks run on the FRONT_COMMERCE_MAGENTO1_ENDPOINT URL. If you want to disable these health checks, you can pass the disabled option to your extension configuration.

front-commerce.config.ts
import { defineConfig } from "@front-commerce/core/config";
import magento1 from "@front-commerce/magento1";

export default defineConfig({
extensions: [
magento1({
healthChecks: {
disabled: true,
},
}),
],
});