Skip to main content

Conceptual Overview

In this section, we will explore the architecture of Webround and how the different modules interact with each other to transform an abstract configuration into a high-performance website or e-commerce.

Three-Tier Architecture​

Webround is a decoupled system based on three pillars:

  1. Configuration Layer (Editor): Where the visual and structural definition takes place. The output of this level is purely descriptive (JSON).
  2. Execution Layer (Runtime): The React application that "instantiates" the configuration. it does not contain its own data, but it knows how to render the data it receives.
  3. Data Layer (Commerce & API): The source of truth for dynamic data (prices, stock, orders, filters).

Project Lifecycle​

Understanding how a site moves from idea to publication is essential to making the most of the platform:

0. Choosing a Template​

You cannot create a site from scratch: you need a template. Open the templates section of Webround and choose a ready-to-use template. You will be able to modify every single element later.

1. Design (Drafting)​

Every new site is born as a Draft. In this phase, the configuration is private and can be modified iteratively. The Draft is your permanent staging environment.

Changes to your draft must always be saved before making them persistent; otherwise, they reside only in your web client (your browser). Upon saving, changes are communicated to our systems, which leverage Google Cloud's distributed storage to keep your data private.

Even when you save a draft, the changes remain only in your private area, managed entirely by Webround, without you having to worry about permissions, architecture, or storage space.

2. Store Configuration​

If the site requires e-commerce functionality, you can create a Store. The Store is a container for products and can be connected to Stripe. Note: a store is totally decoupled from a draft at the architectural and infrastructural levels. A draft connected to a store is just one example of a possible integration that Webround handles natively.

3. Deployment (Site Publication)​

At the time of publication, the system performs a build:

  • Validates the JSONs.
  • Generates static assets.
  • Distributes the site on Webround's Edge Network (CDN) to ensure minimal loading times everywhere.

Headless Integration​

Webround embraces the Headless philosophy. This means that the Webround Commerce Store is not forced to live inside a Webround site.

Not only can you integrate custom React code into your Webround draft (and site), but you can, through APIs:

  • Use Webround Commerce as a backend for a mobile app.
  • Integrate the Webround cart into an existing site.
  • Synchronize inventory with external management software via Webhooks.
  • Enable only specific functions such as Webround authentication.
  • Create custom management software with products, filters, and categories.
  • Implement ready-to-use services for connecting to other SaaS or external services.

Next Steps​

To learn more about individual components, consult the specific guides: