A demo of integrate stripe payment with remix, it handles stripe function purely on the server side( getting sessions, redirect etc) and no stripe client needed on the client.
Relevant files:
app/
├── routes/
│ └── api.stripe-web-hook.tsx // api route to get stripe webhook postback
│ ├── buy.tsx // buy button and redirect to stripe payment
│ ├── payment.cancelled.tsx // stripe will redirect to this page if payment failed
│ └── payment.success.tsx // string will redirect to this page if payment successful
└── utils
│ └── stripe.server.tsx // server side function to init a stripe session
└── root.tsx
- create a stripe account
- get the publishable_key and secret key from stripe dashboard
- create a product, get the price id
- setup the webhook to get the post back from stripe, get the signing secrets
- copy the .env.sample to .env, populate the env credentials
Open this example on CodeSandbox:
