saleor-paper-storefront

Guide Next.js 16 Saleor storefront architecture with caching and checkout patterns.

2|Updated Mar 29, 2026
One-click install
npx skills add https://github.com/NagyVikt/codex-plugins --skill saleor-paper-storefront
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: saleor-paper-storefront
Source: https://github.com/NagyVikt/codex-plugins/tree/main/plugins/saleor/skills/saleor-paper-storefront
Command: npx skills add https://github.com/NagyVikt/codex-plugins --skill saleor-paper-storefront

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires saleor/agent-skills, and includes references (resource) components.

What problem does it solve?

This skill provides a structured, AI-ready framework for maintaining and extending the Saleor Paper storefront, ensuring consistency in complex areas like caching, variant selection, and checkout flows.

Core Features & Use Cases

  • Data Layer Management: Implements robust caching strategies using Next.js Cache Components and Partial Prerendering (PPR) to balance performance and data freshness.
  • Product & Checkout Logic: Provides standardized patterns for PDP architecture, variant state machines, and multi-step checkout components.
  • Use Case: When refactoring a product page or debugging a checkout payment failure, use this skill to quickly identify the correct architectural patterns and file locations.

Quick Start

Apply the saleor-paper-storefront skill to guide the refactoring of the product detail page and ensure all caching directives are correctly implemented.

Frequently Asked Questions about saleor-paper-storefront

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

FAQPage Schema
How do I implement cache invalidation for a Saleor Next.js storefront?

Cache invalidation in a Saleor Next.js storefront is handled via webhooks. This skill provides architectural patterns to trigger Next.js Cache Components updates, balancing Partial Prerendering performance with data freshness.

What is the best way to structure product detail pages in a Next.js Saleor storefront?

Structuring product detail pages in a Next.js Saleor storefront requires standardized PDP architecture and variant state machines. This skill provides implementation patterns for consistent UI component composition and resilient data fetching.

How do I manage checkout sessions in a Saleor Next.js ecommerce application?

Checkout session management in a Saleor Next.js ecommerce application uses standardized multi-step checkout components. This skill outlines architectural guidelines to ensure consistent and resilient checkout flows.

Does this approach support GraphQL type generation for Saleor storefront development?

Yes, GraphQL type generation is a critical task covered for Saleor storefront development. The skill provides architectural guidelines to ensure type-safe data fetching within the Next.js 16 environment.

When should I use Partial Prerendering in my Saleor ecommerce storefront?

Use Partial Prerendering (PPR) in a Saleor ecommerce storefront to balance high performance with dynamic data freshness. This skill provides caching strategies to maintain resilient data fetching in complex e-commerce environments.

Saleor storefront checkout or product pages not working correctly, how to fix?

To fix Saleor storefront checkout or product pages, use this skill to identify correct architectural patterns and file locations. It standardizes variant state machines and checkout components to resolve structural inconsistencies.