Storefront Best Practices is a comprehensive guide for building modern ecommerce experiences using Claude Code. It provides specialized guidance for implementing critical shopping features such as multi-step checkout flows, persistent carts, and dynamic product listings. The skill focuses on conversion optimization, mobile responsiveness (handling safe-area insets and touch targets), and accessibility requirements like ARIA live regions. It also includes a mandatory verification workflow for backend SDKs—particularly Medusa—to ensure API calls are accurate and error-free, resulting in production-grade code that follows industry-standard commerce patterns.
主要功能
01Medusa Backend Integration: Specialized workflows for Medusa SDK setup, pricing display, region handling, and shipping logic.
02Automated Ecommerce SEO: Implements JSON-LD product schemas and structured data to improve search engine visibility and rich snippets.
03SDK Verification Workflow: Mandatory steps to verify API methods against documentation or MCP servers to prevent runtime errors.
04197 GitHub stars
05Mobile-First Commerce UX: Enforces 44px touch targets and iOS-specific safe-area inset handling for sticky purchase buttons.
06Optimized Checkout & Cart Patterns: Provides proven layouts for single-page or multi-step checkouts and interactive cart components.
使用场景
01Optimizing an existing shopping experience for better mobile conversion and accessibility.
02Building a new ecommerce storefront from scratch using Next.js, SvelteKit, or React.
03Integrating a Medusa backend into an existing frontend application with full SDK support.