Stripe Integration

Stripe integration enables secure payment processing in Launchtoday. The app comes with Stripe pre-configured, providing a robust payment infrastructure that supports one-time payments, subscriptions, and digital wallet payments like Apple Pay and Google Pay.

​

Prerequisites

Before beginning the setup, ensure you have:

1. A Stripe account
   • Sign up at stripe.com
   • Complete the basic account verification
2. API Keys from your Stripe Dashboard
   • Navigate to Developers > API Keys
   • You’ll need both Publishable and Secret keys

​

Setup Process

​

1. Environment Configuration

Launchtoday already includes the Stripe integration code. To activate it, add your Publishable Key and Secret Key to your .env file (ignore the STRIPE_MERCHANT_IDENTIFIER - this is covered later in the guide):

# Stripe
STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key
STRIPE_SECRET_KEY=sk_test_your_secret_key

​

2. Stripe Provider

The Stripe provider is already implemented in Launchtoday (view in Github). The provider:

• Automatically reads Stripe credentials from your environment variables
• Provides warning messages if credentials are missing
• Exports initPaymentSheet and presentPaymentSheet utilities for payment processing
• Wraps Launchtoday with Stripe’s context provider

The provider is already integrated into Launchtoday’s root component here, so no additional setup is required.

Once you’ve added your Stripe credentials to your environment variables, you’re ready to start processing payments. Here is what the payment sheet from Stripe looks like on iOS and Android:

iOS:

Android:

​

Apple Pay and Google Pay Support

Launchtoday comes with built-in support for both Apple Pay and Google Pay, requiring minimal setup to get started. These platform-specific payment methods are automatically detected and enabled when available on the user’s device, providing a seamless checkout experience.

​

Apple Pay

To set up Apple Pay in your application, including registering for an Apple Merchant ID and creating the necessary certificates, follow the official Stripe guide here.

As part part of the Apple Pay setup, you should have been prompted to create a merchant.com.{{YOUR_APP_NAME}} identifier. In your .env file, add this identifier to the STRIPE_MERCHANT_IDENTIFIER variable as shown in the example below:

# Stripe
STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key
STRIPE_SECRET_KEY=sk_test_your_secret_key
STRIPE_MERCHANT_IDENTIFIER=merchant.com.{{YOUR_APP_NAME}} <-- Update this line with your merchant identifier

Below is an example of what the Apple Pay payment component looks like and how it works:

import { PlatformPay } from "@stripe/stripe-react-native";

<PlatformPayButton
  style={styles.platformPayButton}
  type={PlatformPay.ButtonType.Pay}
  onPress={handlePlatformPayment}
  appearance={PlatformPay.ButtonStyle.Black}
  disabled={!Number(enteredAmount) || isPlatformLoading || isLoading}
/>;

You can find the rest of the implementation here.

​

Google Pay Support

Google Pay is already configured in Launchtoday and requires no additional setup. For detailed information about Google Pay integration and testing, refer to the official Stripe guide here.

Below is an example of what the Google Pay payment component looks like and how it works:

import { PlatformPay } from "@stripe/stripe-react-native";

<PlatformPayButton
  style={styles.platformPayButton}
  type={PlatformPay.ButtonType.Pay}
  onPress={handlePlatformPayment}
  appearance={PlatformPay.ButtonStyle.Black}
  disabled={!Number(enteredAmount) || isPlatformLoading || isLoading}
/>;

You can find the rest of the implementation here.

​

Testing Your Integration

During development, Stripe provides a comprehensive set of test card numbers to simulate different payment scenarios. The most commonly used test cards are:

When using these test cards, you can enter any future expiry date, any three-digit CVC, and any postal code. This allows you to thoroughly test your payment integration without processing real transactions.

​

Monitoring & Debugging Your Integration

Monitoring your Stripe integration is crucial for maintaining a healthy payment system. The Stripe Dashboard provides a comprehensive view of all payment activity, including successful transactions, failed attempts, and detailed error messages. You can access this information at any time through your Stripe Dashboard.

During development, Launchtoday automatically enables detailed logging for Stripe-related activities. These logs can be particularly helpful when troubleshooting integration issues:

// Logs are automatically enabled in development
if (__DEV__) {
  console.log("Stripe payment result:", result);
}

Additionally, Stripe provides test webhook events that you can use to simulate various payment scenarios. This feature is invaluable for testing your application’s response to different payment outcomes without processing actual transactions.

​

Preparing for Production

Before launching your application with live payments, there are several important steps you need to complete to ensure a smooth transition to production:

1. Complete Stripe’s verification process - this is required for processing real payments and helps prevent fraud
2. Replace your test environment variables with live API keys
3. Conduct thorough testing with real cards in a staging environment
4. Implement comprehensive error handling for all possible payment scenarios
5. Update your application’s privacy policy and terms of service to reflect your payment processing practices

For more detailed information about Stripe’s features, capabilities, and best practices, we recommend referring to the official Stripe documentation.