WhoBuilt

"Show me the money" - securely accepting payments in React Native apps

Oct 21, 2021· 24 min· 593 views·Watch on YouTube

Speaker

Thor Schaeff, a developer advocate at Stripe, presents at React Native EU 2021, hosted by Callstack, on securely accepting payments in React Native apps.

Set up PaymentSheet

Schaeff demonstrates Stripe’s React Native SDK in an Expo app. The server retrieves the authenticated customer, creates an ephemeral key and a PaymentIntent, then returns their details to the app. The app initializes and presents PaymentSheet, which supports cards, Apple Pay, Google Pay, and saving payment methods for later.

Choose the right payment route

Schaeff says digital products and services, such as subscriptions, in-game currency, and premium content, must use the app store’s in-app purchase APIs. Stripe can be used for other cases, including physical goods and services. He recommends checking the Apple and Google guidelines for the specific use case.

How the SDK is built

The SDK layers Stripe’s native Android and iOS SDKs beneath native module code, a React Native bridge, TypeScript interfaces, UI components, and convenience hooks. Its native card components keep card information out of the JavaScript bridge and send it directly to Stripe. Schaeff says the native SDK foundation supports PCI compliance and Strong Customer Authentication, including 3D Secure 2.

Expo support and community contributions

Schaeff says the Stripe React Native SDK works with Expo Go starting with Expo SDK 42, and advises using `expo install` to select a compatible version. An Expo config plugin simplifies setup for Apple Pay and Google Pay. He credits the Expo and React Native communities, including Callstack, for helping develop and improve the open source SDK.

Takeaways

  • Create PaymentIntents on the server once the checkout amount is known.
  • Associate ephemeral keys and saved payment methods with the authenticated customer.
  • Use the native UI components to keep card details out of the JavaScript bridge.
  • Check app store rules before choosing a payment method for digital products.
  • For Expo projects, install the Stripe SDK with `expo install` to match the Expo SDK version.

Mentioned in this talk

Search inside this talk

What was claimed 9

Show all 9 facts

Related talks