Why shouldn't I use JSON.stringify with the Medusa SDK?

The Medusa SDK handles JSON serialization automatically; manual stringification causes double-serialization which will result in server-side parsing errors.

How does this skill help with React Query?

It provides hierarchical query key structures and patterns for invalidating data after mutations to ensure your storefront UI remains synchronized with the backend.

Can I use this for custom Medusa API routes?

Yes, it specifically covers using sdk.client.fetch() to communicate with custom endpoints while ensuring standard authentication and headers are maintained.

When should I load this skill?

You should load this skill whenever you are planning, researching, or implementing features for any frontend application powered by Medusa.

Medusa Storefront Development

Name: Medusa Storefront Development
Author: medusajs

bymedusajs

•

E-commerce Solutions

Streamlines Medusa storefront integration by providing standardized patterns for SDK usage, React Query data fetching, and custom API communication.

This skill equips Claude with the specific expertise needed to build robust e-commerce frontends using the Medusa framework. It enforces critical best practices, such as proper SDK serialization and hierarchical React Query keys, while guiding developers through implementing complex features like optimistic updates and error handling. Whether you are calling custom API routes or managing complex cart logic, this skill ensures your storefront follows official Medusa conventions to deliver a production-grade user experience.

Key Features

01Hierarchical cache management and query invalidation strategies

02Automated Medusa SDK usage patterns for custom and built-in API routes

0377 GitHub stars

04Critical serialization rules to prevent common SDK integration errors

05Standardized React Query implementation for efficient data fetching and mutations

06Best practices for UI loading states and optimistic error handling

Use Cases

01Setting up complex data fetching patterns with React Query and the Medusa SDK

02Implementing cart mutations with optimistic updates and robust error recovery

03Integrating custom Medusa API routes into a Next.js or React storefront

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add medusajs/medusa-agent-skills building-storefronts

For use in Claude.ai and ChatGPT

Download Skill