Book a live demoBook a demo →
IndiSell

Hydrogen & Next.js storefronts: the checkout gap Indian D2C brands hit

A headless storefront on Hydrogen or Next.js gives you a fast, custom front end — and then leaves checkout as a decision. For India-first brands, that gap is UPI, COD, RTO and offers. Here's how to close it without rebuilding checkout or leaving your storefront.

I The IndiSell team6 min read

In this article
  1. 1.What headless gives you — and where it stops
  2. 2.The India checkout gap, specifically
  3. 3.Closing the gap without leaving your storefront
  4. 4.One honest caveat
  5. 5.Frequently asked questions

Hydrogen (Shopify's own React framework) and Next.js are the two most common ways Indian brands build a headless Shopify storefront, usually deployed on Vercel or Netlify. They're excellent at what they're for: a fast, fully-custom front end backed by Shopify's Storefront API. What neither gives you is a finished checkout — and for an India-first store, checkout is where conversion and margin are actually decided.

What headless gives you — and where it stops

The Storefront API lets your Hydrogen or Next.js app do the storefront beautifully: products, collections, cart, content, search — all in your own code. It deliberately stops short of the money-handling parts. Payments, tax and the checkout experience are Shopify's domain, and on a themed store you'd get Shopify's native checkout for free. Go headless and you inherit a choice: use that generic native checkout, or build your own. For an India store neither is comfortable — the native flow isn't UPI-first or COD-smart, and building your own means owning payments, COD, RTO, offers and reconciliation forever.

The India checkout gap, specifically

"Checkout" undersells what's missing. For an Indian D2C brand the gap is a stack of India-specific behaviour:

  • A UPI-first payment flow — intent/QR the way shoppers actually pay — not a cards-first form.
  • Cash on delivery with teeth — verification, pincode/state/value rules, caps, partial-COD, and confirmation.
  • RTO control — the risk scoring and rules that keep returns from eating COD margin.
  • Offers that fit — coupons, bundles, free-gift thresholds, prepaid incentives.
  • Conversion tracking that reports COD — server-side events to Google and Meta, so ad optimisation sees the revenue the pixel misses.

That's a product, not a feature — which is exactly why building it inside your Hydrogen or Next.js app is the wrong place to spend engineering time.

Closing the gap without leaving your storefront

The clean answer is to keep your Hydrogen/Next.js storefront for everything it's good at and attach a purpose-built India checkout for the last step. IndiSell does this: it runs on top of your existing Shopify store and your own gateway, and connects to a headless storefront through a lightweight integration — your app hands off the cart when the shopper is ready to pay, and the checkout takes it from there. You don't rebuild payments, COD, RTO or offers, and you don't push shoppers into the generic native checkout. Orders are created in Shopify on the server side at the real price, and money settles directly through your own gateway with no cut of GMV.

The result: your storefront stays 100% yours — framework, hosting, design — and the checkout becomes an India-first, one-page flow with the full COD/RTO, offers and server-side tracking feature set. That's the trade a headless team actually wants: keep the custom front end, drop the checkout problem.

One honest caveat

A headless integration isn't the literal one-click install a themed store gets — there's a small, one-time piece of work to connect the checkout to your storefront, plus connecting your Shopify store and gateway keys. It's measured in hours. And if a custom checkout is the only thing you're chasing, going headless is a heavy way to get it — a checkout like IndiSell on a normal theme already gives you a fully branded one-page flow. Go headless for the storefront; add the checkout, don't rebuild it.

Frequently asked questions

Does IndiSell work with Hydrogen and Next.js storefronts? Yes. IndiSell attaches to a headless Shopify storefront — Hydrogen, Next.js, or a custom React app on Vercel/Netlify — through a lightweight integration, and provides the full India checkout (UPI, COD, RTO, offers) without a Shopify theme.

Do I have to build checkout myself on a headless Shopify store? No. The Storefront API stops before checkout, but you don't need to build payments, COD, RTO, offers or reconciliation — a checkout like IndiSell provides them and creates real Shopify orders. You keep your storefront; the checkout is added, not rebuilt.

Does the checkout still use my own payment gateway on headless? Yes. It runs on your own gateway (PayU, Razorpay, Cashfree, Easebuzz) with direct settlement and no revenue share on GMV — the same as on a themed store.

Want these numbers for your store?

See it live on a private preview of your checkout.

Ready to fix the leak between add-to-cart and paid?

See it live on your own store — a private preview link runs the real checkout for you before a single shopper sees it.

See it on your store
20-min walkthrough · no commitment
Book a demo