Frontend

The Laioutr frontend is the customer-facing Nuxt app with pages, sections, and blocks composed in Studio, powered by a unified data layer (Orchestr) and a set of features you can extend. Start here to understand the product and navigate the docs.

Frontend

The Laioutr frontend is the storefront or website your customers see. It is a Nuxt application that renders pages, sections, and blocks configured in Cockpit (Studio). Data comes from connected backends (e.g. Shopify, Shopware, Commercetools) through a single Orchestr API, and the frontend ships with features—PWA, consent management, tracking, media library, page types, and more—that you can use as-is or extend with your own adapters and apps.

This section is the starting point for the Frontend product topic. Use the links below to go deeper: get the key concepts and tech stack, explore features and how to extend them, or dive into the data layer (Orchestr).

Where to go

Introduction

Key concepts, getting started, and tech stack. Understand how the frontend is structured, how it fits with Studio and apps, and how to run and configure a frontend project.

Features

What ships with the frontend: PWA, consent management, tracking, page types, media library, multi-language, currencies, authentication. Overview of each feature and how to implement your own adapters or extensions.

Orchestr

The backend-for-frontend data layer. Queries, links, actions, and component resolvers; caching; middleware and wire format. For app developers and anyone integrating a new data source.

API Reference

Detailed API and type reference for the frontend and related packages. Go here when you need exact signatures, options, or generated docs.

Use Introduction to get oriented, Features to see what the platform offers and how to plug in your own implementations, and Orchestr to work with the data layer and build or integrate apps that feed the frontend.

Edit this pageorReport an issue

MCP Server

Connect your IDE or AI assistant to the Laioutr documentation MCP server so tools like Cursor, VS Code, and Claude Code can answer questions straight from these docs.

Key Concepts

The main ideas behind the Laioutr frontend including Nuxt app, Studio-driven content, Orchestr data layer, apps and features, and how they fit together.