SDK Guides
Choose an SDK path by framework or native platform. Each guide starts with the package setup path and then points to deeper package documentation when a framework needs extra detail.
If you are starting fresh, choose your framework below and begin with its Quick start section.
Need signatures, types, or generated API details? Start at /api-reference.
If you do not want to get lost
- Choose your SDK.
- Choose your backend mode: MediaSFU Cloud or self-hosted MediaSFU Open.
- Choose your room shape: general meeting, conference, webinar, broadcast, or chat-first.
- Choose how much UI you want to keep: prebuilt, customized, or app-owned.
That order is the fastest path to a working room without mixing transport problems, framework setup, and UI customization into one debugging step.
Choose your SDK
- mediasfu-shared
- MediaSFU ReactJS
- MediaSFU Angular
- MediaSFU React Native
- MediaSFU React Native Expo
- MediaSFU Vue
- MediaSFU Flutter
- MediaSFU Kotlin
Which one should I choose?
- Pick mediasfu-shared when building your own framework wrapper or extending shared core behavior.
- Pick ReactJS for browser apps with direct component/state control.
- Pick Angular for DI-based integration and Angular-native app structure.
- Pick React Native for bare RN projects.
- Pick React Native Expo for Expo-managed workflows.
- Pick Vue for composition-friendly Vue applications.
- Pick Flutter for Dart/Flutter apps that need one codebase across mobile, web, and desktop.
- Pick Kotlin for native Android or Kotlin Multiplatform Compose surfaces.
At a glance
| SDK | Install | Best for |
|---|---|---|
| mediasfu-shared | npm i mediasfu-shared socket.io-client mediasoup-client | Shared core logic across frameworks |
| MediaSFU ReactJS | npm i mediasfu-reactjs | Web apps with full React control |
| MediaSFU Angular | npm i mediasfu-angular | Angular apps with DI-based wrappers |
| MediaSFU React Native | npm i mediasfu-reactnative | Bare React Native mobile apps |
| MediaSFU React Native Expo | npm i mediasfu-reactnative-expo | Expo-managed mobile apps |
| MediaSFU Vue | npm i mediasfu-vue | Vue apps with composition-friendly APIs |
| MediaSFU Flutter | flutter pub add mediasfu_sdk | Cross-platform Flutter apps across Android, iOS, web, desktop, and embedded surfaces |
| MediaSFU Kotlin | implementation("com.mediasfu:mediasfu-sdk-android:1.0.1") | Native Kotlin and Kotlin Multiplatform apps with Compose-first room surfaces |
Choose your backend mode
| Mode | Best for | Read next |
|---|---|---|
| MediaSFU Cloud | Managed infrastructure and the fastest route to a secure working room | /usage/secure-backend-proxy |
| MediaSFU Open / self-hosted | Private infrastructure, local control, and custom deployment ownership | /usage/secure-backend-proxy and /sdks |
Choose your room shape
| Room shape | Best for |
|---|---|
| General meeting | Team calls, product defaults, and the broadest starter path |
| Conference | Multi-speaker sessions, workshops, classes, and collaborative rooms |
| Webinar | Host-led events, audience participation, and stage-centric presentations |
| Broadcast | Livestream-style creator flows, host dashboards, and invite/share-heavy sessions |
| Chat-first | Support rooms, low-bandwidth collaboration, and messaging-led workflows |
Use the Angular gallery at /sdks/angular when you want concrete visual examples of how several of these room shapes look in a real SDK surface.
Choose your UI ownership path
| If you want... | Start with |
|---|---|
| The fastest path with MediaSFU still rendering the visible room experience | /usage/quickstart |
| The default room with targeted branding or surface changes | /usage/ui-overrides |
| A larger custom workspace with MediaSFU still owning room runtime behavior | /usage/custom-component |
| A fully app-owned shell driven by MediaSFU helpers | /usage/headless and /usage/choose-ui-mode |
What these guides include
- Framework-specific setup paths for web, mobile, Flutter, Kotlin, and shared-core integrations.
- Install commands, first-room guidance, and links into the generated API reference for signatures and types.
- Pointers to package READMEs when a framework has deeper examples than the portal page can reasonably hold.