SXA Storefront

Version: 10.1

SXA Storefront helps to accelerate the development and deployment of Sitecore storefronts.

Frontend development encompasses the following elements.

Front end development elements.

Backend development follows Helix principles and encompasses the following elements.

Backend development elements.

The feature layer of the SXA Storefront solution includes all the renderings required to build out a storefront site. These renderings are built as:

  • Scriban-only renderings (for example, the Order Lines rendering)

  • Scriban with Knockout binding (for example, the Product Bundle rendering)

  • Razor-only renderings (for example, the Login rendering)

  • Razor with Knockout binding (for example, the Product Inventory rendering)

For Scriban-only renderings, the HTML markup is in the Scriban template; however, you still require a Razor view with, at a minimum, code such as what is shown in the following example for the Product Price rendering.

RequestResponse
<div @Html.Sxa().Component(Model.Rendering.RenderingCssClass ?? "cxa-productprice-component", Model.Attributes) data-cxa-component-class="ProductPrice" data-cxa-component-initialized="false" data-cxa-component-type="component">
    <div class="component-content">
        @if (Model.Item != null)
        {
            foreach (BaseVariantField variantField in Model.VariantFields)
            {
                @Html.RenderingVariants().RenderVariant(variantField, Model.Item, Model.RenderingWebEditingParams, Model)
            }
        }
    </div>
</div>

Sitecore has many resources available to help you get started with SXA Storefront development and some of the key resources are listed here.

Note

Some of the following links go to a different area of the Sitecore documentation site. To return to this page after clicking a link, use the back button in the browser.

Do you have some feedback for us?

If you have suggestions for improving this article,