← ClaudeAtlas

building-storefrontslisted

Load automatically when planning, researching, or implementing Medusa storefront features (calling custom API routes, SDK integration, React Query patterns, data fetching). REQUIRED for all storefront development in ALL modes (planning, implementation, exploration). Contains SDK usage patterns, frontend integration, and critical rules for calling Medusa APIs.
medusajs/medusa-agent-skills · ★ 215 · Web & Frontend · score 79
Install: claude install-skill medusajs/medusa-agent-skills
# Medusa Storefront Development Frontend integration guide for building storefronts with Medusa. Covers SDK usage, React Query patterns, and calling custom API routes. ## When to Apply **Load this skill for ANY storefront development task, including:** - Calling custom Medusa API routes from the storefront - Integrating Medusa SDK in frontend applications - Using React Query for data fetching - Implementing mutations with optimistic updates - Error handling and cache invalidation **Also load building-with-medusa when:** Building the backend API routes that the storefront calls ## CRITICAL: Load Reference Files When Needed **The quick reference below is NOT sufficient for implementation.** You MUST load the reference file before writing storefront integration code. **Load this reference when implementing storefront features:** - **Calling API routes?** → MUST load `references/frontend-integration.md` first - **Using SDK?** → MUST load `references/frontend-integration.md` first - **Implementing React Query?** → MUST load `references/frontend-integration.md` first ## Rule Categories by Priority | Priority | Category | Impact | Prefix | |----------|----------|--------|--------| | 1 | SDK Usage | CRITICAL | `sdk-` | | 2 | React Query Patterns | HIGH | `query-` | | 3 | Data Display | HIGH (includes CRITICAL price rule) | `display-` | | 4 | Error Handling | MEDIUM | `error-` | ## Quick Reference ### 1. SDK Usage (CRITICAL) - `sdk-always-use` - **ALWAYS use the Medusa JS