1. Technical Overview

SXA Storefront architecture

Version:

The SXA Storefront is built with best practices in mind and based on modular architecture; for more information see the Sitecore Helix development guidelines.

The following technologies are used in the SXA storefront:

  • Sitecore Experience Platform

  • Sitecore Experience Accelerator

  • Basic Bootstrap

  • JQuery

  • Knockout – a JavaScript library that helps you create responsive user interfaces with a clean underlying data model

  • Sitecore and Microsoft ASP.NET MVC

  • HTML 5

  • Newtonsoft JSON

With the SXA Storefront architecture:

  • There is a clear separation of content, presentation, and catalog data.

  • The storefront implementation favors standard functionality over injecting custom code and hooking into Sitecore.

  • No cookies are introduced in addition to what Sitecore demands.

  • The product catalog appears in Sitecore as regular items using a highly optimized data provider.

  • The implementation is completely Sitecore MVC-based and follows Sitecore's MVC-first strategy. All renderings are controller based.

All components are updated using component API calls (AJAX), which has the following advantages:

  • Objects and data are loaded on demand (lazy loading) and there are no page post-backs.

  • There are progress indicators on buttons and tables when an operation is in process.

  • Knockout.js is used for dynamic data binding.

  • Component API calls return JSON.

If you have suggestions for improving this article, let us know!