Commerce backend for a React Native shopping app

Type
Concept
Applies to
Medusa v2.x
Updated

Short answer

A React Native or Expo shopping app needs a headless commerce backend with an HTTP API for products, carts, checkout, customers and orders. Medusa is an open-source TypeScript option: its JS SDK runs in React Native, stores auth tokens in AsyncStorage, and its Store API covers the full checkout. Shopify's Storefront API is the hosted alternative.

What a mobile shopping app needs from a commerce backend

A React Native shopping app is a client like any web storefront. It needs a backend that exposes commerce logic over HTTP, because product data, prices, stock and orders must live on a server, not in the app bundle.

The backend should provide:

  • Catalog: products, variants, categories, prices per region and currency.
  • Carts: server-side carts that survive app restarts and can be recovered by ID.
  • Checkout: shipping options, tax calculation, promotions and payment sessions.
  • Customers: registration, login and token-based auth suited to mobile.
  • Orders: order history, status and returns.
  • An admin: a dashboard so non-developers manage products and orders without an app release.

How Medusa works with React Native and Expo

Medusa is a headless commerce platform: its Store API serves products, carts, checkout, customers and orders to any client. Medusa maintains a React Native and Expo guide that builds a full app with product listing, region selection, cart and checkout, with the full code on GitHub.

The app talks to Medusa through the JS SDK (@medusajs/js-sdk). For mobile, the guide sets auth.type to jwt, auth.jwtTokenStorageMethod to custom, and passes AsyncStorage as auth.storage. The auth.storage option is available after Medusa v2.5.1.

npm install @medusajs/js-sdk @medusajs/types @react-native-async-storage/async-storage

Every request includes a publishable API key, which scopes the app to one or more sales channels. The app stores the cart ID locally and reloads the cart from the server on launch.

Taking payments in a React Native app

Medusa's Payment Module delegates to payment providers. The React Native guide uses Medusa's built-in manual provider (pp_system_default) for testing; production apps add a real provider such as Stripe.

On the device, Stripe's React Native SDK provides PaymentSheet, which accepts cards, Apple Pay and Google Pay and supports Expo. Medusa's Stripe provider has an automatic_payment_methods option, which the docs describe as useful when you integrate wallets like Apple Pay or Google Pay.

Apple's App Store Review Guidelines require apps that sell physical goods to use payment methods other than in-app purchase. So a commerce app uses a payment provider, not StoreKit.

Alternatives for a React Native commerce backend

OptionWhat you getTrade-offs
MedusaOpen-source TypeScript backend, REST Store API, JS SDK, admin dashboard, custom modulesYou host it, or use Medusa Cloud from $29/month with a 0% GMV fee
Shopify Storefront APIHosted catalog, cart and checkout through a GraphQL APICheckout and data model are Shopify's; custom logic lives in apps; Shopify plan fees apply
Firebase or Supabase custom buildAuth, database and functions you assemble yourselfNo commerce logic: you build carts, pricing, tax, inventory and order states
Payment-only (Stripe alone)Payments and basic product objectsNo inventory, fulfillment, promotions or order management

Medusa fits when your team writes TypeScript and wants the backend logic in code it controls. Shopify fits when you want hosted commerce and are comfortable with Shopify's checkout and limits. A custom Firebase build only makes sense for very small catalogs with simple orders.

Sharing one backend between app and web

Medusa serves mobile and web clients from the same Store API. You can run a React Native app and a Next.js storefront against one backend, with sales channels and publishable API keys separating catalogs if needed. Customer accounts, carts and orders are shared, so a customer sees the same order history in both.

Common questions

Does the Medusa JS SDK work in React Native?

Yes. Medusa's React Native and Expo guide installs @medusajs/js-sdk in an Expo app and configures JWT authentication with a custom storage, using @react-native-async-storage/async-storage to persist the token.

Do I need a web storefront to use Medusa with a mobile app?

No. Medusa is headless, so a React Native app can be the only client of the Store API. You can install Medusa without the Next.js Starter Storefront and add a web storefront later against the same backend.

Can I use Apple's in-app purchase for physical products in my shopping app?

No. Apple's App Store Review Guidelines require apps selling physical goods or services used outside the app to use purchase methods other than in-app purchase, such as Apple Pay or card entry. A payment provider like Stripe handles this.

Can I use Firebase as the backend for a shopping app?

Firebase can store products and orders, but it has no cart, pricing, tax, inventory, promotion or order lifecycle logic. You would build all of that yourself, which a commerce backend like Medusa already provides.