Bare Workflow
Learn how to integrate the Para SDK with React Native projects.
The Para SDK for React Native allows you to easily integrate secure and scalable wallet functionalities into your mobile applications, utilizing the device’s Native Passkeys for secure wallet management. This guide covers the installation, setup, and usage of the Para SDK.
Prerequisites
To use Para, you need an API key. This key authenticates your requests to Para services and is essential for integration.
Don’t have an API key yet? Request access to the Developer Portal to create API keys, manage billing, teams, and more.
Dependency Installation
Install the required packages for Para SDK integration:
Project Setup
Platform-Specific Configuration
In order for passkeys to work, you need to set up associated domains in your Xcode project linked to the Para domain.
Set Up Associated Domains
- Open your project in Xcode
- Select your target and go to “Signing & Capabilities”
- Click ”+ Capability” and add “Associated Domains”
- Add the following domains:
- webcredentials:app.beta.usecapsule.com
- webcredentials:app.usecapsule.com
For additional information on associated domains, refer to the Apple Developer documentation.
teamId + bundleIdentifier
must be registered with the Para team to set up associated domains. For example, if your Team ID is A1B2C3D4E5
and Bundle Identifier is com.yourdomain.yourapp
, provide A1B2C3D4E5.com.yourdomain.yourapp
to Para. This is required by Apple for passkey security. Note: Allow up to 24 hours for domain propagation.Install CocoaPods for native dependencies:
pod install
after adding new dependencies to your project.In order for passkeys to work, you need to set up associated domains in your Xcode project linked to the Para domain.
Set Up Associated Domains
- Open your project in Xcode
- Select your target and go to “Signing & Capabilities”
- Click ”+ Capability” and add “Associated Domains”
- Add the following domains:
- webcredentials:app.beta.usecapsule.com
- webcredentials:app.usecapsule.com
For additional information on associated domains, refer to the Apple Developer documentation.
teamId + bundleIdentifier
must be registered with the Para team to set up associated domains. For example, if your Team ID is A1B2C3D4E5
and Bundle Identifier is com.yourdomain.yourapp
, provide A1B2C3D4E5.com.yourdomain.yourapp
to Para. This is required by Apple for passkey security. Note: Allow up to 24 hours for domain propagation.Install CocoaPods for native dependencies:
pod install
after adding new dependencies to your project.Set Up Digital Asset Links
For Android setup, you need to provide your app’s SHA-256 certificate fingerprint to Para.
com.getpara.example.reactnative
as your package name for immediate testing. This package name is pre-registered and works with the SHA-256 certificate from the default debug.keystore.To get your SHA-256 fingerprint:
- For debug builds:
keytool -list -v -keystore ~/.android/debug.keystore
- For release builds:
keytool -list -v -keystore <your_keystore_path>
Device Requirements
To ensure passkey functionality works correctly:
- Enable biometric or device unlock settings (fingerprint, face unlock, or PIN)
- Sign in to a Google account on the device (required for Google Play Services passkey management)
Configure Metro Bundler
Create or update metro.config.js
in your project root:
Add Para Shim
Import the Para shim as the FIRST import in your application’s entry file (typically index.js
):
Using the Para SDK
The Para SDK provides two main authentication methods: email-based and phone-based. Each method supports creating a new user and logging in an existing user. Both flows utilize Native Passkeys for secure and seamless authentication. Follow the steps below to implement these flows in your React Native application.
Beta Testing Credentials In the BETA
Environment, you can use any email ending in @test.getpara.com
(like
dev@test.getpara.com) or US phone numbers (+1) in the format (area code)-555-xxxx
(like (425)-555-1234). Any OTP
code will work for verification with these test credentials. These credentials are for beta testing only. You can
delete test users anytime in the beta developer console to free up user slots.
Create New User with Email
This flow guides you through the process of registering a new user with email, verifying their email, and setting up their wallet.
Initialize Para Client
First, set up the Para client to enable SDK interactions:
Para offers two hosted environments: Environment.BETA
(alias Environment.DEVELOPMENT
) for testing, and
Environment.PROD
(alias Environment.PRODUCTION
) for live use. Select the environment that matches your current
development phase.
Register New User
Create a new user account by calling the createUser
method. This will automatically send a verification email to the user:
Verify Email
Once the user receives the verification code, call the verifyEmailBiometricsId
method to confirm their email:
Register Passkey and Create Wallet
Use the returned biometricsId to register the user’s passkey and create their wallet:
Complete New User Flow
Implement the full flow by combining all the previous steps:
recoverySecret
with the user. This secret is necessary for account recovery in case the user loses access to their device. Ensure you have a secure method to display or store this secret for the user.Login Existing User with Email
This flow demonstrates how to authenticate an existing user using their email and passkey.
Check User Existence and Login
Verify if the user exists and log them in using their passkey:
login
method allows passing in an email if you want to specifically select a passkey for that email. If no email is provided, the user will be prompted to select a passkey from the available options.Create New User with Email
This flow guides you through the process of registering a new user with email, verifying their email, and setting up their wallet.
Initialize Para Client
First, set up the Para client to enable SDK interactions:
Para offers two hosted environments: Environment.BETA
(alias Environment.DEVELOPMENT
) for testing, and
Environment.PROD
(alias Environment.PRODUCTION
) for live use. Select the environment that matches your current
development phase.
Register New User
Create a new user account by calling the createUser
method. This will automatically send a verification email to the user:
Verify Email
Once the user receives the verification code, call the verifyEmailBiometricsId
method to confirm their email:
Register Passkey and Create Wallet
Use the returned biometricsId to register the user’s passkey and create their wallet:
Complete New User Flow
Implement the full flow by combining all the previous steps:
recoverySecret
with the user. This secret is necessary for account recovery in case the user loses access to their device. Ensure you have a secure method to display or store this secret for the user.Login Existing User with Email
This flow demonstrates how to authenticate an existing user using their email and passkey.
Check User Existence and Login
Verify if the user exists and log them in using their passkey:
login
method allows passing in an email if you want to specifically select a passkey for that email. If no email is provided, the user will be prompted to select a passkey from the available options.Create New User with Phone
This flow guides you through the process of registering a new user with a phone number, verifying it, and setting up their wallet.
Initialize Para Client
First, set up the Para client to enable SDK interactions:
Para offers two hosted environments: Environment.BETA
(alias Environment.DEVELOPMENT
) for testing, and
Environment.PROD
(alias Environment.PRODUCTION
) for live use. Select the environment that matches your current
development phase.
Register New User
Create a new user account by calling the createUserByPhone
method. This will automatically send a verification code to the user’s phone:
Verify Phone
Once the user receives the verification code, call the verifyPhoneBiometricsId
method to confirm their phone number:
Register Passkey
Use the returned biometricsId to register the user’s passkey:
Create Wallet
After passkey registration, create the user’s wallet:
Complete Phone-based Flow
Here’s an example of a complete phone-based authentication flow:
recoverySecret
with the user. This secret is necessary for account recovery in case the user loses access to their device. Ensure you have a secure method to display or store this secret for the user.Login Existing User with Phone
This flow demonstrates how to authenticate an existing user using their phone number and passkey.
Check User Existence and Login
Verify if the user exists and log them in using their passkey:
login
method requires providing both the phone
and countryCode
parameters to select the appropriate passkey.By following these steps, you can implement a secure and user-friendly authentication system in your React Native application using the Para SDK, with support for both email and phone-based authentication methods.
Examples
For practical implementation of the Para SDK in React Native environments, check out our GitHub repository:
Troubleshooting
If you encounter issues during the integration or usage of the Para SDK in your React Native application, here are some common problems and their solutions:
For a more comprehensive list of solutions, visit our troubleshooting guide:
Next Steps
After integrating Para, you can explore other features and integrations to enhance your Para experience.