Superwall

Learn how to handle paywalls, secure premium content, configure subscriptions & in-app purchases, and more.

Introduction

We use Superwall to create & A/B test paywalls, as well as handle payments for subscriptions, in-app purchases, etc.

In this section, we'll go over:

Setting up your first paywall and sandbox environment
Presenting the paywall
Rolling out paywall experiments
Optionally setting up RevenueCat to handle purchases instead of Superwall

Setup

Sign up for an account

Go to https://superwall.com/ and click sign up

Platform: select React Native
Organization Name: an identifier for your organization.
App Name: enter your app's name, company name, or 10-digit Apple ID
Bundle ID: the identifier for your app bundle. This should be the same value in your Expo app.config.json.

Create products

We need to create products (subscriptions, one-time purchases, etc.) in the App Stores, and then sync them to Superwall. This is how Superwall will know what users can buy, and what they did buy.

For iOS and Android app stores, please follow the official Superwall guide here.
For Stripe (web) products, please follow the official docs here.

Retrieve your API keys

Superwall Keys Setup

From the Superwall dashboard, you should see an iOS project, an Android project, and a web project. click on Settings (it's the last option in the left-hand menu), and then Keys.
Make note of the Public API Key. It should start with pk_.

Add API key to your app

For the Expo app, update apps/native/.env.development with applicable values:

EXPO_PUBLIC_SUPERWALL_IOS_PUBLIC_KEY=<your iOS Project Public API key>
EXPO_PUBLIC_SUPERWALL_ANDROID_PUBLIC_KEY=<your Android Project Public API key>
EXPO_PUBLIC_SUPERWALL_WEB_PUBLIC_KEY=<your Web Project Public API key>

If you're not targeting a particular platform, feel free to omit the key.

These are able to be EXPO_PUBLIC_ because they're meant to be embedded within your app.

If you are using EAS to build and release your application (recommended), you will need to also add the above values into EAS.

This can be done by going to https://expo.dev/, open your project, and go to Environment Variables. You can enter the above keys for all environments.

(Android-only) Add Superwall Maven Repository

// In your app's android/build.gradle...
allprojects {
    repositories {
        maven { url 'https://mvn.superwall.com/release' }
    }
}

Superwall

Introduction

Setup

On this page