React Native

Zing publishes a public React Native sample app that demonstrates how to bridge the native Zing SDKs into a React Native (Expo) project. The sample covers the same surface as the native SDKs: initialization with API keys, launching native screens, and platform-specific build configuration.

• Sample repository: Muze-Fitness/fitness-coach-sdk-react 

Requirements

Setup

1. Install JavaScript dependencies:

npm install

2. Copy the API key template and fill in your values:

cp constants/ZingApiKeys.example.ts constants/ZingApiKeys.ts

Set iosApiKey and androidApiKey in constants/ZingApiKeys.ts.

3. Generate the native projects with Expo:

npx expo prebuild

4. Configure Android Maven credentials so the build can pull the native Zing SDK from GitHub Packages. Add the following to the generated android/local.properties:

sdk_maven_read_username=<github-username>
sdk_maven_read_token=<github-token>

The token must be a GitHub PAT with the read:packages scope.

Alternatively, export the same values as environment variables:

export ZING_SDK_MAVEN_USER=<github-username>
export ZING_SDK_MAVEN_TOKEN=<github-token>

5. Run the app on the simulator/device of your choice:

npx expo run:ios
# or
npx expo run:android

How the bridge works

The sample wraps the native iOS and Android SDKs in an Expo native module under modules/zing-sdk. The JavaScript surface mirrors the native SDKs and exposes the same operations: initialize, login, logout, observe auth state, and open native screens. Because the bridge delegates to the native SDKs, all SDK features work the same way as in a native app.

For full configuration details (auth modes, callbacks, error codes), see the Authorization guide and the native iOS and Android references.

Building your own React Native integration

If you would rather integrate Zing into an existing React Native app instead of starting from the sample, you can use the sample repository as a reference and copy the modules/zing-sdk bridge into your project. Adjust app.json, native build files, and Maven credentials as shown above, then call the bridge from your JavaScript code.