I've built Stripe checkout from scratch 3 times. Here's what no one tells you.

Every time a client needs an e-commerce feature, the conversation starts the same way.

"We need Stripe checkout. How long?"
And every time I say two months, they look at me like I'm padding the estimate.

I'm not.

Here's what's actually hiding inside "just add Stripe checkout."

1. The cart is not a frontend problem

The instinct is to keep cart state in React. useState, maybe Zustand, done in an afternoon.

Then your user adds items on desktop, opens their phone, and the cart is empty.

A production cart lives on the server. Every add/remove/update hits an API. The frontend is a view, not the source of truth. That's a full Mongoose model, a set of CRUD endpoints, and session-aware middleware — before you've touched Stripe at all.

2. Stripe SCA is not Stripe Checkout

SCA (Strong Customer Authentication) is mandatory in Europe and increasingly common everywhere. It means the payment flow isn't a single redirect — it's a multi-step confirmation that your frontend has to handle gracefully.

const paymentIntent = await stripe.paymentIntents.create({
  amount: orderTotal,
  currency: 'usd',
  automatic_payment_methods: { enabled: true },
});

Then on the client, you're handling requires_action, requires_payment_method, and succeeded states separately. Each one needs a different UI path.

3. Webhooks are where things break in production

The payment succeeded on the client. Great. But your server doesn't know yet.

Webhooks are how Stripe tells your backend what actually happened — and they arrive asynchronously, out of order, and sometimes more than once.

const event = stripe.webhooks.constructEvent(
  req.body,
  req.headers['stripe-signature'],
  process.env.STRIPE_WEBHOOK_SECRET
);

switch (event.type) {
  case 'payment_intent.succeeded':
    await fulfillOrder(event.data.object);
    break;
  case 'charge.refunded':
    await handleRefund(event.data.object);
    break;
}

You need idempotency handling, signature verification, and a clear fulfillment model. Miss any of these and you'll have orders that paid but never confirmed — or confirmed twice.

4. Order management is a separate product

Once the payment goes through, you need:

• A customer view (what did I order, what's the status)
• An admin view (filter all orders, update status, process refunds)
• Status transitions that make sense (pending → paid → shipped → delivered)

That's two full UIs and a state machine. Not complex — but a lot of screens.

5. The admin dashboard needs RBAC from day one

Without role-based access control, your admin routes are either wide open or you're scattering if (user.isAdmin) checks across the codebase. Neither scales.

A proper RBAC middleware layer means routes declare what they need and middleware enforces it:

router.get('/admin/orders',
  authenticate,
  requireRole('admin', 'sales'),
  OrderController.getAll
);

Three roles minimum: public, customer, admin. Adding more later is trivial when the pattern is in place from the start.

6. S3 image upload is a full integration on its own

Product images need to live somewhere. That means presigned URLs, upload from the admin form, and references stored in MongoDB. Works with AWS S3 or DigitalOcean Spaces — but either way it's a separate surface to wire correctly.

What this actually adds up to

Every time I've built this stack from scratch, it's taken 6–8 weeks for a senior developer. Not because any single piece is hard — because there are multiple pieces and they all have to work together correctly in production.

After doing it for the third time, I packaged everything into a kit.

Checkout Kit ships with:

• React 19 frontend — MUI and Tailwind flavors, both included
• Go or Node backend — same API contracts, your choice of runtime
• MongoDB, Mongoose, JWT + bcrypt
• All 6 surfaces above, already wired together
• Mock mode for full frontend dev without a running server
• 17+ production screens, 35+ API endpoints

Setup to first live checkout: under 15 minutes.

Live demo (no signup): https://checkout-kit.dashforge-ui.com
Full details: https://dashforge-ui.com/starter-kits/checkout-kit

Free for the first 5 developers who want to try it

I'm giving the Developer tier away free to the first 5 developers who want to try it.

Try it. Then leave an honest comment with your impressions — what worked, what didn't. No star ratings, no forms. Just real feedback from a real developer.

Comment "interested" below and I'll DM you the link.