Setting up the HCL Commerce Developer Tooling environment

HCL Commerce provides a standalone HCL Commerce Developer Tooling environment Software Development Kit (SDK).

Before you begin

The HCL Commerce Developer Tooling environment requires the following prerequisites before you can use it to develop your tooling customizations:
  • Before installing HCL Commerce Developer software, ensure that your HCL Commerce development environment meets the hardware and software requirements.
  • You must have access to a running HCL Commerce Version 9.1 Transaction server.

    This can be from a development or production environment.

    The default configuration for the Tooling SDK proxy expects this server to be running on localhost. If your Transaction server is not running on your local machine, modify the commerce-tooling/proxy.conf.json (for HCL Commerce 9.1.0.0 and 9.1.1.0), or the HCL Commerce Version 9.1.2.0 or latercommerce-tooling/proxy.conf.js proxy configuration file to specify the location of the Transaction server.

  • You must have access to Management Center for HCL Commerce.

    The default user ID and password for the development environment version of Management Center is wcsadmin:wcs1admin.

  • You must have Node.js installed. Node.js includes the Node Package Manager (npm) utility.
    HCL Commerce Version 9.1.14.0 or laterThe supported node version is v18-lts (includes npm 9.6.x).
    Note: Prior to HCL Commerce 9.1.14.0, the Tooling SDK required Node v14-lts.

    To install Node.js, visit https://nodejs.org/en/download/.

Procedure

  1. Obtain the HCL Commerce Developer Tooling environment Tooling SDK.
    1. Review Obtaining HCL Commerce Developer software and Review the list of the latest available download packages to ensure that you are obtaining the most up-to-date version of HCL Commerce software.
    2. Download and extract the latest version of the Tooling SDK to obtain the HCL_Commerce_Tooling_9.1.x.x.bundle Git bundle.
  2. Clone the project in Git from the downloaded Git bundle.
    Run the following command:
    git clone bundleName projectName
    Where:
    bundleName
    The filename of the bundle you are cloning.
    projectName
    The name of the git project that you are creating.
    For example:
    git clone HCL_Commerce_Tooling_9.1.0.0.bundle HCL_Commerce_Tooling
  3. Use the Node package manager (NPM) to install the Tooling SDK node server.
    1. Navigate to the HCL_Commerce_Tooling\commerce-tooling directory.
    2. Run the npm install command.
      npm install
      LinuxNote: If you encounter a certificate error, set the NPM strict-ssl configuration to false. For example, run npm config set strict-ssl false.
  4. Start the Tooling development server.
    In the same directory, run the command:
    npm start
  5. HCL Commerce Version 9.1.9.0 or later If you are upgrading from a previous version of the Tooling SDK, update the proxy.conf.json (for HCL Commerce 9.1.0.0 and 9.1.1.0), or HCL Commerce Version 9.1.2.0 or laterproxy.conf.js proxy configuration file.
    • Point to the IP address or the host name of the search data environment for search resources.
      For example:
      "/search/resources/api/v2/categories":
      {         "target": "https://localhost:30921",         "secure": false,         "changeOrigin": true     }
    • Update the store localhost URLs to HTTPS, and specify the correct port to properly render images in mock search results within Management Center for HCL Commerce.
      For example:
       "/hclstore":
      { "target": "https://localhost:6443", "secure": false, "changeOrigin": true }
      Note: The React store SDK server must be running to render mock search results in the Management Center Search tool.
  6. Use the local host. To use localhost:7443, you need to run the following command to configure the browser first:
    https://localhost:7443/lobtools/cmc/Configure?featureName=localAdminConsole&featureEnabled=true
  7. Launch Management Center for HCL Commerce to verify that your installation was successful.

    In a browser, navigate to https://localhost:7443/lobtools/cmc/ManagementCenter to launch Management Center.

Results

You can now preview the tools that are provided by this Single Page Application (SPA) through the Management Center tools hamburger menu. For example, select User Management to open the User Management tool. The SPA is loaded in an iFrame and routed to the selected tool.

What to do next

Ensure that you check the code into your source control management system so that your work can be collaborated on and is safely persisted.