saleor-development

Build Saleor Apps, GraphQL storefront queries, and dashboard extensions for headless commerce.

3|1|Updated Mar 21, 2026
One-click install
npx skills add https://github.com/tomtoto757/ecomm-ai-team --skill saleor-development-tomtoto757
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: saleor-development
Source: https://github.com/tomtoto757/ecomm-ai-team/tree/main/skills/platform-integrations-infrastructure/finsilabs/headless-modern/saleor-development
Command: npx skills add https://github.com/tomtoto757/ecomm-ai-team --skill saleor-development-tomtoto757

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @saleor/app-sdk, @saleor/cli, urql, graphql-request.

What problem does it solve? Developers integrating Saleor's headless commerce backend must correctly wire up GraphQL API queries, app registration, signed webhook handling, and dashboard UI extensions, which involves many platform-specific conventions that are easy to get wrong. ## Core Features & Use Cases - Storefront GraphQL Integration: Query channel-scoped product catalogs with cursor pagination, authenticate customers, and complete checkouts via typed GraphQL operations. - Saleor App Development: Bootstrap apps with @saleor/app-sdk, declare manifests with permissions and webhook subscriptions, and verify HMAC-signed webhook payloads using SaleorAsyncWebhook. - Dashboard Extensions: Inject custom UI panels into the Saleor Dashboard via App Extensions and communicate with the host using app-bridge actions. - Use Case: A logistics startup needs to react when orders are placed. Use this Skill to scaffold a Next.js Saleor App whose ORDER_CREATED webhook securely receives order data and hands it to a fulfillment pipeline. ## Quick Start Ask the AI to scaffold a Saleor App with a manifest, registration endpoint, and a secure ORDER_CREATED webhook handler using the Saleor app-sdk.

Frequently Asked Questions about saleor-development

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

FAQPage Schema
How do I build a Saleor App with webhooks in Next.js?▼

Create a manifest handler with createManifestHandler from @saleor/app-sdk/handlers/next, declaring permissions, tokenTargetUrl, and webhook entries with GraphQL subscription queries. Handle events with SaleorAsyncWebhook, which verifies HMAC signatures automatically.

How to fetch all products from Saleor GraphQL API with pagination?▼

Query products with a required $channel variable and request pageInfo { hasNextPage endCursor }. Loop while hasNextPage is true, passing endCursor as the after variable on each request until all pages are retrieved.

Does Saleor support custom UI inside the dashboard?▼

Yes, Saleor App Extensions render an iframe inside the dashboard at declared mount points like PRODUCT_DETAILS_MORE_ACTIONS. The extension page uses useAppBridge and actions from @saleor/app-sdk/app-bridge to dispatch notifications to the host.

Why is my Saleor webhook payload empty or missing fields?▼

Saleor webhook payloads are defined by the GraphQL subscription query in your app manifest. Add the fields you need to the query property, and ensure the webhook handler exports config with bodyParser disabled for signature verification.

Why does my Saleor dashboard extension show a blank iframe?▼

The extension URL must be served over HTTPS and include Access-Control-Allow-Origin headers for the dashboard origin. Also confirm the APP_URL environment variable matches the publicly reachable URL registered in the dashboard.