---
url: https://talkjs.com/build/mobile-chat-sdk/
title: "Mobile chat SDK for iOS and Android apps | TalkJS"
---

For AI agents: Find a documentation index at https://talkjs.com/llms.txt (full content at https://talkjs.com/llms-full.txt). Get a markdown version of any page by appending .md to its URL path.

[Skip to content](https://talkjs.com/build/mobile-chat-sdk/#main-content)

Mobile

# Mobile chat SDK: finished chat screens for React Native, Expo, and Flutter apps

On React Native, Expo, or Flutter, you get finished screens for 1-on-1 and group chat between your users, with the backend, push, and email notifications behind them. And it's light: with push set up, our Expo kit added 21 npm packages. The other hosted UI kits added 46 to 191.

[Try for free](https://talkjs.com/dashboard/signup/premium/)[Contact sales](https://talkjs.com/contact/)

```
import React from 'react';
import * as TalkRn from '@talkjs/expo';

function ChatComponent(props) {
  const me = {
    id: '123456789',
    name: 'Alice',
    email: 'alice@example.com',
    photoUrl: 'https://talkjs.com/images/avatar-1.jpg',
    welcomeMessage: 'Hey there! How are you? :-)',
  };

  const other = {
    id: '987654321',
    name: 'Sebastian',
    email: 'Sebastian@example.com',
    photoUrl: 'https://talkjs.com/images/avatar-5.jpg',
    welcomeMessage: 'Hey, how can I help? https://google.com',
  };

  const conversationBuilder = TalkRn.getConversationBuilder(
    TalkRn.oneOnOneId(me, other)
  );

  conversationBuilder.setParticipant(me);
  conversationBuilder.setParticipant(other);

  return (
    <TalkRn.Session appId="<APP_ID>" me={me}>
      <TalkRn.Chatbox conversationBuilder={conversationBuilder} />
    </TalkRn.Session>
  );
}
```

## Which TalkJS SDK should I use for my mobile app?

Pick the row for the stack your app is written in. The first three come with finished chat screens. On native Swift or Kotlin, you get the messaging data and draw the screens yourself.

| Your app | Install | What you get | Needs |
| --- | --- | --- | --- |
| Expo | `@talkjs/expo` | Chat screens: Chatbox and conversation list | React Native 0.70 or later, a development build |
| React Native CLI | `@talkjs/react-native` | Chat screens: Chatbox and conversation list | React Native 0.70 or later |
| Flutter | `talkjs_flutter` | Chat widgets: ChatBox and ConversationList | Flutter 3.38 and Dart 3.10 or later |
| Swift (iOS) | `talkjs-core-swift` | Users, conversations, and messages in real time, for your own screens | iOS 15 or later |
| Kotlin (Android) | `com.talkjs:core` | Users, conversations, and messages in real time, for your own screens | Android API 24 or later |

The React Native and Flutter screens look and work the same on iOS and Android, and you style them once, in the Theme Editor in your dashboard, the same way as the Classic JavaScript SDK on the web. Each stack has its own page: [React Native](https://talkjs.com/build/react-native-chat/), [Flutter](https://talkjs.com/build/flutter-chat/), [iOS](https://talkjs.com/build/ios/), and [Android](https://talkjs.com/build/android/). If you're building for the web too, see [all our chat SDKs](https://talkjs.com/build/chat-sdk/).

## How many packages does a chat UI kit add to an Expo app?

Every package is one more thing to update when you move to a new Expo or React Native version. So we installed four hosted chat UI kits into the same fresh Expo app, push notifications included, and counted what each one brought along.

npm packages a chat UI kit adds to an Expo app, push notifications included

TalkJS

21 packages

CometChat

46 packages

Sendbird

120 packages

Stream

191 packages

0100200 packages

Packages added to the lockfile of a fresh Expo 54 app (React 19.1, React Native 0.81) by each vendor's install and push guides, November 3, 2026. TalkJS `@talkjs/expo` 0.17.1 with expo-notifications, CometChat 5.5.3, Sendbird 3.12.10, Stream `stream-chat-expo` 9.11.1, whose push guide also adds expo-dev-client.

Leave push out, and the counts are 11 for TalkJS, 45 for CometChat, 114 for Stream, and 120 for Sendbird, whose install already includes expo-notifications. If you use Firebase for push instead of expo-notifications, TalkJS adds 82, most of them the Firebase SDK, which Stream's push guide installs too. For features and prices side by side, see our [chat API comparison](https://talkjs.com/compare/best-chat-apis/).

## How do I add 1-on-1 chat to an Expo or React Native app?

Install the Expo kit and its dependencies. Some of them contain native code, so the kit needs a development build and won't run in Expo Go:

```
npx expo install @talkjs/expo @notifee/react-native \
  react-native-webview \
  @react-native-async-storage/async-storage \
  expo-build-properties
```

Then follow our [React Native getting started guide](https://talkjs.com/docs/UI_Components/React_Native/). This component from it creates two users, puts them in a 1-on-1 conversation, and opens it in a Chatbox. Replace `<APP_ID>` with your app ID from the dashboard. In a React Native CLI app, import `@talkjs/react-native` instead:

```
import React from 'react';
import * as TalkRn from '@talkjs/expo';

function ChatComponent(props) {
  const me = {
    id: '123456789',
    name: 'Alice',
    email: 'alice@example.com',
    photoUrl: 'https://talkjs.com/images/avatar-1.jpg',
    welcomeMessage: 'Hey there! How are you? :-)',
  };

  const other = {
    id: '987654321',
    name: 'Sebastian',
    email: 'Sebastian@example.com',
    photoUrl: 'https://talkjs.com/images/avatar-5.jpg',
    welcomeMessage: 'Hey, how can I help? https://google.com',
  };

  const conversationBuilder = TalkRn.getConversationBuilder(
    TalkRn.oneOnOneId(me, other)
  );

  conversationBuilder.setParticipant(me);
  conversationBuilder.setParticipant(other);

  return (
    <TalkRn.Session appId="<APP_ID>" me={me}>
      <TalkRn.Chatbox conversationBuilder={conversationBuilder} />
    </TalkRn.Session>
  );
}
```

A group chat is the same conversation with more participants: up to 100 on the Basic plan and 300 on Growth. Before you go live, [turn on authentication](https://talkjs.com/docs/Features/Security/Authentication/), so that only your users can open their chats. Your backend signs a token for each user, and your app passes it to the Session.

On Flutter, run `flutter pub add talkjs_flutter`, create a Session with your app ID, and show the conversation in a ChatBox widget. The [Flutter chat page](https://talkjs.com/build/flutter-chat/) has the full example.

![Catawiki logo](https://talkjs.com/core/logos/catawiki.svg)

> We needed chat and didn’t want to build it ourselves because it needs to be really great. The TalkJS team is laser-focused on chat, and we’re focused on building a great auction marketplace.

Dennis Pereira

Head of Product, Catawiki

## How do push notifications work on iOS and Android?

When someone gets a message while they're away from the chat, TalkJS sends the push for you, on every plan. You add your Firebase Cloud Messaging credentials for Android and your APNs key for iOS in the dashboard, and the SDK registers each device. On Expo, you can use expo-notifications or the Firebase libraries. The [Expo push guide](https://talkjs.com/docs/Guides/React_Native/Push_Notifications_Expo/) has both.

Push isn't the only way to reach people. Someone who misses a message also gets an [email notification](https://talkjs.com/features/notifications/), and when they reply to the email, the reply shows up in the conversation.

## Is there a free chat SDK for mobile apps?

TalkJS is free in development mode, with every feature, so you can build and test your whole mobile chat before you pay. You need a paid plan once real users are on it. Basic is $279 a month ($239 billed annually) for 10,000 monthly active users. See [Pricing](https://talkjs.com/pricing/).
