Storefront Development Tips

In this document, you’ll find tips useful when building a storefront.

Connect to the Medusa Application#

To send requests from the storefront to the Medusa application’s Store API Routes, you have three options:

• For JavaScript frameworks: use Medusa’s JS SDK in any JavaScript framework. This NPM package facilitates interacting with the backend’s REST APIs.
• For other frontend technologies: interact directly with the Medusa application by sending requests to its Store REST APIs.

Install Types Package#

The @medusajs/types package provide API routes' request and response types.

If you're not using the JS SDK, install @medusajs/types to use the correct request and response types:

npm
yarn
pnpm

Configure CORS#

The Medusa application’s API routes are guarded by a CORS middleware. Make sure to set the storeCors property of the http configuration in medusa-config.ts to the storefront’s URL.

For example:

medusa-config.ts
1module.exports = defineConfig({2  projectConfig: {3    http: {4      storeCors: "http://localhost:3000",5      // ...6    },7  },8  // ...9})