Create Storefront Next in Business Manager with Local Code

Create a storefront and its dependent API and Managed Runtime (MRT) resources in Business Manager with the local CLI option to generate and store your code locally.

  • A developer B2C Commerce instance or on-demand sandbox (ODS) instance. See Create On-Demand Sandboxes for B2C Commerce in Salesforce Help.
  • Managed Runtime User or Managed Runtime Admin role in Account Manager.
  • Business Administrator role in Account Manager or a role for the Business Manager Module and Organization context with read-write access to storefronts. See Create a Role in B2C Commerce in Salesforce Help.
  • The prerequisites for creating storefront code with the CLI. See the prerequisites in Explore Storefront Next Code Locally.
  • Storefront setup supports only one storefront per site. A site can’t be associated with more than one storefront.
  • If storefront setup fails, you must delete and recreate the storefront.

  1. In Business Manager, click App Launcher App Launcher and then select Administration > Sites > Storefronts > New.

  2. Select Storefront Next.

  3. Enter the storefront name. For example, my-local-storefront.

  4. Select a site. You can select one or more sites for your storefront. For this task, select one site.

    You can assign a site to one storefront only. You can’t reuse it for another storefront.

  5. Select Salesforce CLI to generate the storefront code manually.

    Storefront setup page in Business Manager with the local CLI

  6. Click Start Setup.

  7. After setup completes, in Source Code, click Download .env from the completion page to download the env.txt environment file. It contains your storefront’s configuration, Business Manager settings, and your Account Manager and Shopper Login and API Access Service (SLAS) credentials.

    The Storefront Next setup completion page points to development resources

    For your security, the client secrets are available for download only once and are deleted on subsequent downloads. You use the Account Manager and SLAS client credentials to run the storefront locally. When you run the storefront on MRT, MRT uses the autocreated environment variables.

  8. To view the storefront on MRT, click the view icon next to the environment. View the storefront on MRT

  9. To view details about the autocreated environment, in the Environments section, click the environment name. The new environment links to deployments, environment variables on MRT, and shows the eCDN routing rules for the default domain.

    Setup created an MRT project and sent an initial deployment of the storefront. The deployed bundle is a generated storefront that mirrors the storefront you generate with the CLI.

  10. To view the deployment on MRT, from the storefront page in Business Manager, click Manage in the Deployments section. Verify that the setup process created an MRT project and environment and sent an initial deployment of the storefront app. To view the deployment on MRT, click Managed Runtime Environment.

    Initial storefront deployment in Managed Runtime

  11. To generate the storefront code, type this command in a terminal window.

    a. Provide the same storefront name you used earlier. For example, my-local-storefront.

    The storefront corresponds to a project in MRT. The autogenerated project ID, which is based on the storefront name, identifies your project in MRT. You set the project ID in a later step from the downloaded environment file.

    b. For the Storefront Next UI template, select Salesforce B2C Commerce Retail Storefront.

    c. For the extensions, press Enter to accept the selected extensions.

    d. Accept the defaults for the client IDs and the B2C Commerce instance values. You overwrite the configuration with your own storefront environment file in the next steps.

  12. Open the project folder in an IDE, and then open the environment file: {project-folder}/.env.

  13. Replace the contents of {project-folder}/.env with the contents of the downloaded env.txt file, which contains values specific to the new storefront and the B2C Commerce instance.

    The MRT project has a name and an ID, which are different. The env.txt file contains the MRT project ID.

  14. Make sure that your site’s search indexes are up-to-date. For more information, see Generate Search Indexes in Salesforce Help.

  15. In a terminal window, go to the storefront folder.

  16. Install Storefront Next project dependencies that are specified in package.json.

  17. Build the storefront.

  18. Run the development server.

  19. Open the development server URL shown in the output to view the storefront in the browser. For example, the URL with the default port is http://localhost:5173.