Skip to main content

Conceptual Overview

In this section, we will explore the Webround architecture and how its different modules interact to transform an abstract configuration into a high-performance, highly extensible digital ecosystem.

Decoupled Architecture​

Webround operates on a Headless-first model, based on the strict separation between definition, execution, and data:

  1. Configuration Layer (Editor): The design environment where visual and logical structures are defined. The result is not "closed" static code, but a descriptive JSON Schema that governs the site's behavior.
  2. Execution Layer (Runtime): The React application that interprets the JSON schema. The runtime is a dynamic entity: it contains no fixed data but instantiates the interface and logic in real-time, allowing for custom React code injection or interaction with external APIs.
  3. Data Layer (Commerce & API): The source of truth for dynamic entities (prices, inventory, orders, metadata). It is the engine that enables business logic independently of the presentation layer.

Project Lifecycle​

the Webround workflow is designed to ensure operational security without sacrificing implementation freedom:

1. Drafting and Permanent Staging​

Every project begins as a Draft. In this phase, the configuration is private and isolated. Changes reside in the browser until saved, at which point they are persisted on encrypted distributed storage. This ensures a constant staging environment: you can test complex React logic or new Hooks without any impact on the public site, with the guarantee that you are the only one with read and write permissions.

2. Commerce Orchestration (Store)​

Enabling e-commerce functions is done by creating a Store. Architecturally, the Store is an entity independent of the Draft. This separation is fundamental: you can have a Draft that consumes data from a Store, but you can also have a Store that serves data to external systems (Mobile apps, POS, legacy sites) via API, while the Draft serves only as an administrative interface or showcase site.

3. Edge Deployment​

Publishing (Deploy) triggers a build process that validates schemas, optimizes static assets, and distributes everything across the Webround Edge Network. Thanks to the global presence of the runtime on edge nodes, the site benefits from minimal latency and the ability to execute middleware logic via Hooks before the page reaches the user. This allows a server-side approach to a static React + Vite app.

Open Logic and Integration Freedom​

Webround is not a closed system. Its "Open-Logic" architecture allows it to overcome the limits of traditional no-code through three dimensions of extensibility:

  • Custom React Injections: Using the Webround SDK, you can insert custom React components directly into the runtime. You can install npm libraries, manage global states, or create complex widgets that interact natively with the cart and catalog.
  • Server-Side Hooks: You can intercept requests at the Edge level to modify checkout or rendering behavior. This allows for the implementation of dynamic pricing logic, access restrictions, or B2B integrations requiring secure server-side calculations.
  • Headless Ecosystem: Webround Commerce can be used as a pure engine. Through APIs and Webhooks, you can:
    • Synchronize inventory with ERPs or on-premise management systems.
    • Use Webround as an authentication layer for third-party applications.
    • Create post-sale automation flows (document delivery, CRM triggers).
    • Develop custom administration interfaces tailored to your workflow.

Next Steps​

To further explore technical configuration and platform extension: