Expo stripe

easy component making collecting payment super easy using expo or bare react native all you need is stripe public key and function that will handel the token once generated like making a request to your server where it will make a charge also you can pass a card color and text for the button

Installation

installing by npm

npm install expo-stripe

Requirements

token and stripeKey are the only required props

import React from 'react'
import {View, Text} from 'react-native'
import Stripe from 'expo-stripe'
export default function App () {
    const publicKey = "pk_sakdasokwkdawjdaasd"
    const [viewToken, setViewToken] = React.useState()
    const func = (token)=>{
        setViewToken(token)
        //call api or anything with token
    }
  return (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center', marginHorizontal:30 }} >
        <Text>
            {JSON.stringify(viewToken)}
        </Text>
        <Stripe token={(token)=>{func(token)}} stripeKey={publicKey}/>
   </View>
  );
}

Other props

other props are cardColor, buttonText

 <Stripe token={(token)=>{func(token)}} stripeKey={pkey} buttonText={"Pay $500"} cardColor={#d11717}/>

more props will be added in next releses

how to use stripe and the token in general

once the token has been generated you pass it to your backend such in node you can create charges by requiring stripe and initializing it with the secret key

const stipeCharge = require('stripe')('sk_test_ajdkajdpokawdokafjsklfjejpow' );
app.post("/stripe", async (req, res)=>{
    const token = req.body.tocken
    const amount = 20 
    const charge = await stipeCharge.charges.create({
        amount: amount*100,
        currency: 'usd',
        source: token.id,
        description: 'react native stripe checkout',
      });
    res.send(charge.status)
})

for more information visit stripe website

Built by

Ahmed Gameel at [jeem] (https://facebook.com/jeemsudan)