deco-site-patterns

Document Deco CMS wiring, section patterns, client patterns, and app composition.

5|2|Updated Feb 26, 2026
One-click install
npx skills add https://github.com/decocms/deco-start --skill deco-site-patterns
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: deco-site-patterns
Source: https://github.com/decocms/deco-start/tree/main/.cursor/skills/deco-site-patterns
Command: npx skills add https://github.com/decocms/deco-start --skill deco-site-patterns

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Deco-site-patterns provide a centralized reference for Deco storefront patterns, clarifying CMS wiring, section conventions, client patterns, and app composition to speed up development.

Core Features & Use Cases

  • Documents CMS wiring, section patterns, client patterns, and app composition to help teams compose stores reliably.
  • Illustrates the three-layer architecture (framework, apps, site repo), CMS block resolution, and admin tooling conventions (JSDoc annotations, LoadingFallback, and widget types).
  • Useful for building new sections, wiring CMS data, creating islands, setting up analytics, and understanding app composition.

Quick Start

Inspect the Sub-documents (cms-wiring.md, section-patterns.md, client-patterns.md, app-composition.md) to begin.

Frequently Asked Questions about deco-site-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I wire CMS data in Deco storefront sections?

Wire CMS data in Deco storefronts by implementing the __resolveType method to resolve CMS blocks. This pattern connects your sections to content management systems for reliable data rendering.

What is the three-layer architecture for Deco storefront development?

The Deco storefront architecture consists of three layers: framework, apps, and site repo. This structure organizes components and integrates apps across the site.ts factory and AppContext.

How do I create client islands and set up analytics in Deco?

Create client islands and set up analytics by following Deco client patterns. These patterns document how to manage client-side execution and data tracking within storefront sections.

What admin tooling conventions are required for Deco section patterns?

Deco section patterns require JSDoc annotations, LoadingFallback implementations, and specific widget types. These admin tooling conventions ensure sections integrate properly with the platform interface.

Can I use Deco site patterns for app composition across site.ts?

Yes, Deco site patterns support app composition across the site.ts factory and AppContext. They document how to compose stores reliably and integrate new apps into storefront architecture.

Does Deco storefront architecture work for platform-agnostic development?

Deco storefront architecture remains platform-agnostic and easily searchable. It satisfies documentation and tooling requirements while supporting teams building sections and integrating apps.