> ## Documentation Index
> Fetch the complete documentation index at: https://docs.pipecat.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# React Native SDK Overview

> Build React Native applications with Pipecat's React Native client library

The Pipecat React Native SDK leverages the [Pipecat JavaScript SDK](/api-reference/client/js/overview) and its `PipecatClient` to provide seamless integration for React Native applications.
Since the JavaScript SDK is designed to work across both web and React Native platforms, the core functionalities remain the same:

* Device and media stream management
* Connecting to Pipecat bots
* Messaging with Pipecat bots and handling responses using the RTVI standard
* Managing session state and errors

The primary difference lies in the transport layer, which is tailored to support the unique requirements of the React Native environment.

For example, when using the SDK with React Native, you would install `RNDailyTransport` instead of `DailyTransport`.

## Installation

Install the SDK and a transport implementation. Follow the appropriate docs for each transport:

* [Daily](https://github.com/pipecat-ai/pipecat-client-react-native-transports/tree/main/transports/daily#installation)
* [SmallWebRTC](https://github.com/pipecat-ai/pipecat-client-react-native-transports/tree/main/transports/smallwebrtc#installation)

<Note>
  Installing the React Native automatically includes the corresponding version
  of the JavaScript SDK.
</Note>

## Requirements

This package introduces some constraints on what OS/SDK versions your project can support:

* iOS: Deployment target >= 15
* Android: `minSdkVersion` >= 24

## Quick start

Here's a simple example using Daily as the transport layer:

```tsx theme={null}
import { RNDailyTransport } from "@pipecat-ai/react-native-daily-transport";
import { PipecatClient } from "@pipecat-ai/client-js";

// Create and configure the client
let pipecatClient = new PipecatClient({
  transport: new RNDailyTransport(),
  enableMic: true,
  enableCam: false,
});

// Connect to your bot
await pipecatClient.startBotAndConnect({
  endpoint: `${process.env.PIPECAT_API_URL || "/start"}`,
});
```

### More Examples

<CardGroup>
  <Card title="Basic Example" icon="file-code" href="https://github.com/pipecat-ai/pipecat-client-react-native-transports/tree/main/examples">
    A basic example demonstrating how to integrate an RNDailyTransport with a
    React Native project.
  </Card>

  <Card title="Daily Full Example" icon="mobile" href="https://github.com/pipecat-ai/pipecat-examples/tree/main/simple-chatbot/client/react-native">
    A more comprehensive Daily example showcasing a more feature-rich React
    Native application along with a server-side bot component.
  </Card>

  <Card title="SmallWebRTC Full Example" icon="mobile" href="https://github.com/pipecat-ai/pipecat-examples/tree/main/p2p-webrtc/video-transform">
    A more comprehensive SmallWebRTC example showcasing a more feature-rich
    React Native application along with a server-side bot component.
  </Card>
</CardGroup>

## Explore the SDK

The Pipecat React Native SDK leverages the Pipecat JavaScript SDK for seamless integration with React Native applications. For detailed information, refer to our JavaScript documentation.

> Just ensure you use the appropriate transport layer for React Native.

<CardGroup cols={2}>
  <Card title="React Native API Reference" icon="book" href="/api-reference/client/react-native/api-reference">
    React Native-specific API documentation
  </Card>

  <Card title="Transport Packages" icon="network-wired" href="/api-reference/client/react-native/transports/daily">
    Daily and SmallWebRTC transports for React Native
  </Card>

  <Card title="JS Client Constructor" icon="cube" href="/api-reference/client/js/client-constructor">
    Configure your client instance with transport and callbacks
  </Card>

  <Card title="JS Client Methods" icon="code" href="/api-reference/client/js/client-methods">
    Core methods for interacting with your bot
  </Card>
</CardGroup>