building-storefrontslisted
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