# High-performance video for your React Native application

Mux is the best way to quickly add video to your React Native application. Mux solves the hard problems with embedding, storing, streaming, and customizing video.

```javascript
import Video from 'react-native-video';

const VideoPlayer = () => {
 const playbackId = `PLAYBACK_ID`
 const url = `https://stream.mux.com/${playbackId}.m3u8`

return (
   <Video
    source={url}
  />
 )
}
```

## Bring cost effective video infrastructure to your React Native application

### Adaptive Bitrate

#### Adaptive Bitrate Streaming
Leverage the latest technology in video streaming, and deliver optimized video to your viewers based on their network environment for the best possible viewing experience.

### Integration

#### Easily integrate into your app
Mux will integrate into whatever app you're building. [Integrate with your CMS](https://docs.mux.com/guides/integrate-with-your-cms), or use our APIs to build your own video workflow.

### Player

#### Full control of your playback
Mux delivers video in the [HLS adaptive streaming format](https://docs.mux.com/guides/play-your-videos), which is compatible with the most popular [React Native video player](https://www.npmjs.com/package/react-native-video).

### Globe

#### Global multi-CDN delivery
Mux's [Video API](/content/video/index.html) delivers video globally with a [multi-CDN strategy](/content/video-glossary/multi-cdn/index.html) to ensure every viewer has the best possible playback experience.

## How to add video to React Native

### Video playback with the react-native-video package
For video playback we'll use [React Native's popular react-native-video package](https://www.npmjs.com/package/react-native-video), which supports the [HLS adaptive streaming format](https://docs.mux.com/guides/play-your-videos) that Mux uses to deliver your video.

### Create an Asset with Mux
If your site has just a few videos, you might upload them to Mux directly through the dashboard. In the [Mux Dashboard](https://dashboard.mux.com/), on your video assets page, select "Create New Asset". On the next screen, you can upload a video directly to Mux.

Fullscreen

Fullscreen

You'll then be able to see your new asset on your video assets page. When you click on the asset, you can find the asset's playback ID in the "Playback and Thumbnails" tab. This playback ID is what we will need for the video player.

Fullscreen

If you're managing more videos, you might take a look at our [CMS integrations](https://docs.mux.com/integrations/cms).
Or, if you need more control over your video workflow, read on.

### Use the API to build a video workflow
Want to build your own video workflow? Here's an example of what you can do with the Mux API.

Let's start by creating an upload URL using the [Mux TypeScript SDK](https://github.com/muxinc/mux-ts) and the [Direct Uploads API](https://docs.mux.com/api-reference#video/operation/create-direct-upload).

If you go this route, you will want to [listen for Mux webhooks](https://docs.mux.com/guides/listen-for-webhooks). When we receive the notification that the video is ready, we'll add it to our database.

The specifics of handling webhooks will depend on your server-side language and framework.

### Build live streaming into your React Native application
Mux APIs support broadcasting and playback for live streams with React Native applications.

Broadcast Mux live streams with this [React Native rtmp-publisher package](https://github.com/ezranbayantemur/react-native-rtmp-publisher).

Playback live streams the same way you would playback an on-demand video over HLS with the [react-native-video package](https://www.npmjs.com/package/react-native-video).

Learn more in the [Start live streaming guide](https://docs.mux.com/guides/start-live-streaming).

### Bridge Mux's native iOS and Android SDKs (optional)
For a more advanced client-side integration you have the option to bridge Mux's native mobile SDKs
- [Mux Player for iOS](https://docs.mux.com/guides/mux-player-ios) and [Mux Player for Android](https://docs.mux.com/guides/mux-player-android) integrate Mux Data for playback [performance & engagement metrics](/content/data/index.html).
- [Mux Uploader for iOS](https://docs.mux.com/guides/upload-video-directly-from-ios-or-ipados) and [Mux Uploader for Android](https://docs.mux.com/guides/upload-video-directly-from-android) have advanced functionality like client-side transcoding and max-resolution settings to speed up processing.

Bridging Mux's native SDKs is not required, but you can go down this route by following [React Native's guide for Native Modules](https://reactnative.dev/docs/native-modules-intro).