SCAYLE Storefront API + Laioutr: How the Frontend Connects

If you run SCAYLE and want a modern frontend without building one from SDK building blocks, the integration question is straightforward: how does the frontend layer talk to SCAYLE? This article walks through how Laioutr connects to the Storefront API and what stays where.

What the Storefront API provides

The SCAYLE Storefront API is a REST API for customer-facing applications. It serves products, categories, campaigns and promotions, supports search and filtering, and saves baskets and wishlists per customer. Built-in PIM, checkout and order management live in SCAYLE. Because the API is the contract, any frontend can consume it, including Laioutr.

Laioutr is the consumer, SCAYLE is the source of truth

Laioutr connects to the existing Storefront API as a configured layer, not a custom integration project. SCAYLE remains the single source of truth: catalog, pricing, promotions, inventory and orders stay in the backend. There is no data duplication and no sync layer to keep consistent. The frontend requests data when it renders and submits basket and checkout actions back through the API.

What this means in practice

• Product and category pages render from live Storefront API catalog and search responses
• Basket and wishlist actions are API calls, so cart and order logic stay in SCAYLE
• Promotions and campaigns are served from the API and rendered in Laioutr components
• Customer sessions and authentication run through the Storefront API session model

A configured layer, not a greenfield build

Building on the SCAYLE Storefront SDK gives you composables, but you still assemble and maintain the UI. Laioutr ships the commerce components and their API behaviors prebuilt, so the connect step is configuration. Marketing teams then compose pages and campaigns on top without touching the integration. Because both Laioutr and the SCAYLE SDK are Nuxt-based, the technical fit is clean.

Performance and hosting

Laioutr serves the frontend from an EU CDN with a Lighthouse 100 target and server-side rendering for SEO. Frontend-layer caching reduces load on the SCAYLE backend for read-heavy catalog traffic, which matters at SCAYLE's scale.

FAQ

Do we need custom API work?

Standard Storefront API endpoints cover most storefronts. Project-specific needs can be handled through the API and rendered in Laioutr components.

Does Laioutr store our product data?

No. Data stays in SCAYLE. Laioutr requests it at render time through the Storefront API; there is no duplicate datastore to maintain.

Is the backend touched during setup?

No backend re-architecture is required. You use the Storefront API and configure the Laioutr connect layer. Talk to our team to scope your SCAYLE setup.

More on Laioutr: Personalization.

Related reading: Vendure Shop API + Laioutr: How the Frontend Connects and SAP Commerce Cloud OCC API + Laioutr: How the Frontend Connects.