ASP.NET Core SDK architecture

Version: 0.x (alpha public release)

The Sitecore ASP.NET Core SDK architecture follows the ASP.NET Core framework and standard conventions for the HTTP request-response cycle.

Basic data flow

Here's a brief overview of how data flows between the web browser, the ASP.NET Core app, and XM Cloud:

  1. When a site visitor visits the ASP.NET Core front-end web app in their web browser, the app receives an HTTP request.

  2. The SDK, installed in the ASP.NET Core app, makes a GraphQL API request to Sitecore Experience Edge to retrieve JSON-formatted layout data from XM Cloud.

  3. The ASP.NET Core app renders the layout data to the site visitor.

Here's a basic diagram showing this data flow:

A basic diagram showing the data flow between the web browser, the ASP.NET Core app, and XM Cloud.

Complete data flow

Here's a detailed explanation of the complete data flow between the web browser, the ASP.NET Core app, and XM Cloud:

  1. The ASP.NET Core app receives an incoming HTTP request.

  2. The ASP.NET Core SDK maps the URL of the HTTP request to a controller action with the [UseSitecoreRendering] attribute.

    The ASP.NET Core SDK follows the standard ASP.NET Core process of routing to controller actions.

  3. The UseSitecoreRendering attribute triggers the Sitecore Rendering Engine middleware. The controller action does not run yet.

  4. The Rendering Engine Middleware makes a GraphQL API request to Experience Edge, using data from the HTTP request.

    Example: if the requested URL is https://<hostname>/products, the middleware makes a request to Experience Edge for an item in XM Cloud at the /products path.

  5. Experience Edge sends the response to the Rendering Engine Middleware.

  6. The Rendering Engine Middleware deserializes the response into a rendering context and runs the controller action to render the view.

  7. The controller action starts rendering the view using the data in the response.

    In this step, the ASP.NET Core app uses Sitecore tag helpers, such as <sc-placeholder/>, to resolve the components that come from Experience Edge into model-bound views, view components, and partial views.

  8. After the entire component tree is rendered, the final HTTP response is created.

  9. The ASP.NET Core app renders the layout data to the site visitor.

Here's a complete diagram, showing all the details of the data flow, including how the layout data is used to render a page in the app:

A full diagram showing all the details of the data flow between the web browser, the ASP.NET Core app, and XM Cloud.

Do you have some feedback for us?

If you have suggestions for improving this article,