a quick refresher on commerce cloud Storefront Reference Architecture (SFRA)

Salesforce Salesforce #dreamjob Salesforce Partners Salesforce Architects


  • this architecture provides the blueprint for site design
  • SFRA customization model makes it easy for you to build, maintain, and update your storefront
  • sits outside of the platform API layer and uses a conventional MVC architecture

Mobile First Design

  • responsive design adapts what’s on the screen based on the screen size.
  • it’s one of the best strategies to create either a responsive or adaptive design.
  • adaptive design detects the device and other features and then provides the appropriate feature and layout based on a predefined set of viewport sizes and other characteristics.
  • mobile-first designs for the smallest screen, and then works its way up

Let's Talk Architecture

  • a reference architecture serves as a starting point for online storefront design and combines best practices in site design and storefront architecture.
  • it gives you a blueprint for building and customizing your eCommerce storefronts.
  • uses JavaScript controllers
  • in B2C Commerce, controllers are server-side scripts that handle storefront requests
  • they manage the flow of control in the application and create instances of models and views to process each storefront request and generate an appropriate response

Controllers are written in JavaScript and B2C Commerce script. They must conform to the CommonJS module standard.

  • in B2C Commerce, a cartridge contains code or data.
  • this architecture allows for a lightweight and cleaner codebase for continuous, iterative, and evolutionary site design.
  • the core code is not available for edit, while developers are free to develop functionality on top of it.
  • the SFRA uses the popular Bootstrap front-end component UI library

Other Things to Know

  • SFRA comes with annotated wireframes
  • B2C Commerce Retail Practice team can provide storefront design consultations to help merchants optimize their existing storefronts or make the move to something new.

LINK Partners

  • provides a world-class ecosystem of rich, robust capabilities that merchants use to deliver best-in-class eCommerce solutions
  • the most-used LINK cartridges — Paypal, CyberSource, Bazaarvoice (Ratings & Reviews), Avalara (Tax), Adyen, Experian QAS (AVS) — are available in the SFRA
  • when evaluating new site designs or redesigns, merchants and SI implementers should consider the LINK ecosystem to extend the commerce experience.

if you liked this article or found it useful, a follow would be much appreciated. Alternatively, you could buy me a coffee! All the support is much appreciated. :-)




Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store

I often describe myself as a software professional having the mindset to break things but the toolset to create and restore.