SocketFi React Native SDK: Installation and Config

Setting up the SocketFi React Native SDK involves installing three packages, registering a URL scheme in your Expo config, and creating a shared client instance. The process takes about ten minutes on a fresh Expo project.

Install the SDK

npm install @socketfi/react-native

yarn add @socketfi/react-native

pnpm add @socketfi/react-native

Install Expo dependencies

The SDK uses expo-web-browser to open hosted authentication and approval screens, and expo-linking to handle the deep link that brings users back to your app after they complete the flow. Install both with the Expo CLI so they are pinned to a version compatible with your Expo SDK:

npx expo install expo-web-browser expo-linking

Always use npx expo install rather than plain npm install for Expo packages. This ensures the installed version is compatible with your current Expo SDK version and avoids hard-to-debug runtime errors.

Configure your app scheme

SocketFi needs a custom URL scheme to redirect users back to your app after authentication. Add the scheme field to app.json:

app.json

{
  "expo": {
    "name": "Acme Pay",
    "slug": "acme-pay",
    "scheme": "acmepay"
  }
}

Choose a scheme that is unique to your app (e.g. acmepay, myfinanceapp). After the user authenticates, SocketFi will redirect them to:

acmepay://socketfi/auth/success

The scheme field is required. Without it, users will complete authentication in the browser and have no way to return to your app. See the Deep Linking guide for full configuration details.

Set up environment variables

Store your Client ID in an environment variable using Expo’s config system. Add it to a .env file at the root of your project:

.env

EXPO_PUBLIC_SOCKETFI_CLIENT_ID=your_client_id_here

Access it in your code with:

process.env.EXPO_PUBLIC_SOCKETFI_CLIENT_ID

Do not commit your .env file to source control. Add it to your .gitignore. Your Client ID ties requests to your registered SocketFi application.

Initialize the SocketFi client

Create a shared instance in a dedicated file and import it wherever you need it. Avoid constructing multiple instances across different components.

lib/socketfi.ts

import { SocketFi } from "@socketfi/react-native";

export const socketfi = new SocketFi({
  clientId: process.env.EXPO_PUBLIC_SOCKETFI_CLIENT_ID!,
  network: "TESTNET",
});

Full configuration example

lib/socketfi.ts

import { SocketFi } from "@socketfi/react-native";

export const socketfi = new SocketFi({
  clientId: process.env.EXPO_PUBLIC_SOCKETFI_CLIENT_ID!,
  network: "TESTNET",

  brand: {
    appName: "Acme Pay",
    primaryColor: "#4F46E5",
  },

  onSuccess(session) {
    console.log("SocketFi session:", session);
  },

  onError(error) {
    console.error("SocketFi error:", error);
  },
});

The React Native SDK accepts exactly the same constructor options as the React SDK. Refer to the React installation guide for the full ParamField reference.

Minimal working example

Once the client is initialized, you can trigger authentication from a button:

App.tsx

import { View, Button } from "react-native";
import { socketfi } from "./lib/socketfi";

export default function App() {
  async function handleLogin() {
    try {
      const session = await socketfi.authenticate();
      console.log("Signed in:", session.userProfile.id);
    } catch (error) {
      console.error("Login failed:", error);
    }
  }

  return (
    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
      <Button title="Continue with SocketFi" onPress={handleLogin} />
    </View>
  );
}

HTTPS is not required during React Native development — Expo’s dev server and the Metro bundler run over HTTP locally and this is fine. However, all SocketFi API calls made from production builds must go over HTTPS. Configure your production environment accordingly before submitting to app stores.

Next steps

With the SDK installed and initialized, configure deep linking so SocketFi can return users to your app after authentication:

Configure Deep Linking

Set up expo-linking event listeners and handle the SocketFi redirect URLs.

React SDK

React Native SDK

Server SDK

API Reference

SocketFi React Native SDK: Installation and Config

Install the SDK

Install Expo dependencies

Configure your app scheme

Set up environment variables

Initialize the SocketFi client

Full configuration example

Minimal working example

Next steps

Configure Deep Linking

​Install the SDK

​Install Expo dependencies

​Configure your app scheme

​Set up environment variables

​Initialize the SocketFi client

​Full configuration example

​Minimal working example

​Next steps

Configure Deep Linking

Install the SDK

Install Expo dependencies

Configure your app scheme

Set up environment variables

Initialize the SocketFi client

Full configuration example

Minimal working example

Next steps