Start by modifying the package.json in your custom site Salesforce provides a mechanism to selectively override CSS styles and client-side JavaScript because you’re not supposed to edit the app storefront base cartridge directly. The paths field in the package.json file lists every cartridge with CSS and client-side JavaScript functionality that has been configured in your site. Go to…

PWA stands for Progressive Web Apps. These are web apps that use service workers, manifests, and other web-platform features in combination with progressive enhancement to give users an experience on a par with native apps. PWA Kit is a framework for creating storefronts with React and headless APIs. PWA kit…

Create a file Hello.js inside the app_custom_cartridge/cartridge/controllers folder that will print Hello World using h1 tags directly to the response. Copy the below code to this file and try to access the below storefront path to check the output: https://xxxx-xxx.sandbox.usxx.dx.commercecloud.salesforce.com/on/demandware.store/Sites-sfrademo-Site/en_US/Hello-World code: ‘use strict’; var server = require(‘server’);

In order to customize SFRA, you will have to install the command-line build tools for SFRA globally. This approach makes it simple to create custom cartridges with the correct structure anywhere on your development machine. npm install -g sgmf-scripts https://github.com/SalesforceCommerceCloud/sgmf-scripts After installation, you can use the sgmf-scripts command-line tools in…

B2C Commerce provides the SFRA (Storefront Reference Architecture) reference application, which is a full-equipped e-commerce storefront or website design, with access to sample code, and sample data. If you are starting a new project, Salesforce recommends using SFRA as the basis of your implementation. …