commercetools-frontend
commercetools Frontend & Storefront Development
Two Development Paths
This skill covers two distinct approaches to building storefronts on commercetools:
| Approach | When to Use | Key File |
|---|---|---|
| commercetools Frontend (hosted) | Using Studio for business users, extensions, components (tastics), data sources | references/ct-frontend-extensions.md |
| Headless with Next.js/React | Custom storefront with full control, App Router, Server Components | references/storefront-architecture.md |
| B2B Storefront | Business units, permissions, approval workflows, quotes, purchase lists | references/b2b-frontend.md |
Both approaches share patterns for product pages, cart/checkout UI, and performance/SEO. B2B patterns layer on top of either approach.
How to Use This Skill
- Identify which approach you are using (commercetools Frontend or headless Next.js)
- Load the relevant architecture file first
- Then load the page-type-specific reference for your current task
More from ariessolutionsio/composable-skills
commercetools-api
Production-tested patterns for commercetools cart/checkout, orders, payments, B2B, promotions, extensions, and subscriptions from a Platinum partner with 50+ live implementations.
20commercetools-data
Production-tested patterns for commercetools product types, custom types/objects, categories, import/export, and data migration from a Platinum partner with 50+ live implementations.
17commercetools-merchant-center
Production-tested patterns for commercetools Merchant Center custom applications, custom views, UI Kit, and deployment from a Platinum partner with 50+ live implementations.
17algolia
Algolia commerce search patterns and commercetools integration — InstantSearch, ranking, relevance, and product sync. Coming soon.
2akeneo
Akeneo PIM development patterns and commercetools integration — API usage, data pipelines, and product enrichment workflows. Coming soon.
2