Payment intents

Install stripe

npm install stripe

Import Stripe

import Stripe from 'stripe';

Generate your instance

Generate a payment intent

source: https://stripe.com/docs/payments/accept-a-payment?integration=elements
  1. We generate a payment intent on the API side via Stripe
  2. We send this to the client app
  3. The client app will use the secret and key to complete a transaction directly with stripe
  4. Stripe will return a succeeded. Also incidentally not included in this flow, it will fire to a webhook too on the API. This is useful if you need to change some state to reflect the transaction was a success e.g. trigger shipping.
// eslint-disable-next-line

Webhook

  • Make it easier to test — the signature thing is a pain.
  • Setup some logging so I can see this working on my side.
  • Change the ES-Lint rules, they’re a little strict for ‘learning’… no-console especially 😿

--

--

--

Fullish-stack engineer (codebykev.dev) and Lead front-end engineer @Cinch with 20 developing stuff for things with screens since the turn of the millenium.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Iteration H2: Testing Our JavaScript Fun ctionality

3 Ways To Use Props In Vue JS

How to create own Giphy clone in React

“TypeError: undefined is not a function”— Yes, it’s JavaScript!

Using NextAuth.js with Magic links

Reading and Writing Files Asynchronously

Open sourcing Layoutit Grid

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Kevin Jones

Kevin Jones

Fullish-stack engineer (codebykev.dev) and Lead front-end engineer @Cinch with 20 developing stuff for things with screens since the turn of the millenium.

More from Medium

Frontend Insider #5

Dropdown problem with using UI Scaling

About my newly learned technology (Redux toolkit)

Front-end tech stack components 🧐