Published in


React Native payment using Stripe

Hi Friends, In this article, I will explain react-native payment gateway Stripe.



Stripe is an American technology company based in San Francisco, California. Its software allows individuals and businesses to make and receive payments over the Internet. Wikipedia. Read more click here.

How we can use Stripe in React Native?

There are two methods:

  1. Stripe checkout.
  2. tipsi-stripe.

But In this article, I will cover the first method only.

Stripe checkout

For using Stripe checkout in React Native we do not need to install any stripe plugins. We need to web-view and API credentials.


  1. React-native web view
  2. Stripe PUBLIC_KEY
  3. Success URL
  4. Cancel URL

Let’s start the project.

Step 1

$ react-native init StripeReactNative
$ cd StripeReactNative
$ npm install react-native-webview --save

Step 2

Set below detail in your constant.


We can get the plan name here.

Step 3

Stripe checkout render HTML.


The above code we set HTML and Plain JavaScript code. And passed PUBLIC_KEY, PLAN_NAME and Success and cancel URL.

Then next step is rendering stripeCheckout.js file in the home screen.

Step 4


The above code we render stripeCheckout.js file web view.

Run your application and give valid detail. If payment is the success it will call your success URL or if your payment is failed it will your cancel URL. Once payment completed successfully check the dashboard you can see the status.:

Thank you for reading. Have a great day!

Reference links:



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
Edison Devadoss

Edison Devadoss

Software developer / JavaScript / React / React Native / Firebase / Node.js / C Programming / Book Reader / Story Teller