Quick Start

Place a 1:1 voice or video call between two users with the built-in UI.

Before you start

1. React Native CLI app or Expo development build (not Expo Go)
2. Project in the Developer Console → credentials for token minting
3. Mic (and camera for video) usage strings — Permissions
4. Two devices (or a device + simulator where your setup allows) with different userIds

1. Install

npm install @alaznah/calling
cd ios && pod install && cd ..

Rebuild the native app after install.

2. Request permissions

import { requestCallPermissions } from '@alaznah/calling';

await requestCallPermissions({ video: false }); // voice
// await requestCallPermissions({ video: true }); // video

3. Wrap the app and show calling UI

import React from 'react';
import {
  CallingProvider,
  CallingScreen,
  DEFAULT_HOSTED_SIGNALING_URL,
} from '@alaznah/calling';

const APP_USER_ID = 'alice';

export default function App() {
  return (
    <CallingProvider
      config={{
        // omit signalingUrl to use the hosted default
        signalingUrl: DEFAULT_HOSTED_SIGNALING_URL,
        userId: APP_USER_ID,
        getAuthToken: async () => {
          const res = await fetch('https://api.yourapp.com/calling/token');
          const { token } = await res.json();
          return token;
        },
      }}
    >
      <CallingScreen userId={APP_USER_ID} defaultPeerId="bob" />
    </CallingProvider>
  );
}

CallingScreen includes dial UI plus automatic routing between incoming, outgoing, and active call states.

4. Place a call

1. Device A — userId: alice — dials bob
2. Device B — userId: bob — shows the incoming screen
3. On B, swipe up on the green accept control (tap does not accept). Decline with the red button.

Foreground calling works once both clients are connected with valid tokens.

5. (Optional) Background ringing

To ring when the app is not open, configure push in the console and follow Push Notifications and Incoming Calls.

Next