Skip to main content

React Native Compact Call Tutorial

Build a mobile call with mediasfu-reactnative@2.4.0. The supplied room provides a join screen, participant list, microphone, camera, camera flip, screen sharing where the device supports it, remote media, leave, and host end.

Prerequisites​

  • Node.js 22.11 or newer, Android Studio or Xcode, and a physical device for the final media check.
  • An HTTPS endpoint in your signed-in application that exposes /api/mediasfu/create-room and /api/mediasfu/join-room.
  • Camera and microphone permissions in the generated Android and iOS projects.

Project files​

Use the complete React Native starter app. It contains every file needed for this package. On its first screen, choose Compact call; the supplied room opens through the secured application backend.

npx @react-native-community/cli@20.1.0 init my-mediasfu-app --version 0.86.2
cd my-mediasfu-app

For an isolated local test, the included screen accepts a short-lived app token. It is not a MediaSFU credential. Replace that temporary input with your normal signed-in session before distributing the app. MediaSFU Cloud credentials stay only in the authenticated backend.

Run​

cd my-mediasfu-app
npm install
npm run android

Expected result​

Choose Compact call, enter the HTTPS app-backend address and an app session token, then create or join. Two devices can see the participant list and test microphone, camera, camera flip, screen sharing, leave, and host end.

Recovery​

  • If sign-in or room authorization is rejected, return to your app’s sign-in flow; do not retry with a Cloud key.
  • If camera or microphone permission is denied, keep the person in the room and let them retry after changing device permission.
  • If remote audio is silent, check the device audio route and the other participant’s microphone before reconnecting.

Cleanup​

Use Leave for one person and End only for the authorized host action. When leaving the wrapper, clear app-owned room state, timers, and subscriptions; the backend expires room authority according to your policy.