About Chat SDK

Through our Chat SDK for JavaScript, you can efficiently integrate real-time chat into your client app. On the client-side implementation, you can initialize, configure and build the chat with minimal effort. On the server-side, Sendbird ensures reliable infra-management services for your chat within the app. This quick start provides the Chat SDK’s structure and installation steps, then goes through the preliminary steps of implementing the Chat SDK in your own project.

Note: Sendbird server supports Transport Layer Security (TLS) from version 1.0 up to 1.3. For example, in the server regions where TLS 1.3 isn’t available, lower versions from 1.2 to 1.0 will be sequentially supported for secure data transmission.


Supported browsers

BrowserSupported versions

Internet Explorer

10 or higher

Edge

13 or higher

Chrome

16 or higher

Firefox

11 or higher

Safari

7 or higher

Opera

12.1 or higher

iOS Safari

7 or higher

Android Browser

4.4 (Kitkat) or higher

XSS prevention

XSS (Cross-site scripting) is a type of computer security vulnerability. XSS helps attackers inject client-side scripts into web pages viewed by other users.

Users can send any types of string data without restriction through the Sendbird Chat SDKs. Make sure that you check safety of received data from other users before rendering it into your DOM.

Note: For more about the XSS prevention, visit the OWASP's XSS Prevention Cheat Sheet page.


Try the sample app

Our sample app has the core features of the Chat SDK. Download the app from our GitHub repository to get an idea of what you can build with the actual SDK and start building in your project.

Download sample app

Note: The fastest way to see our Chat SDK in action is to build your chat app on top of our sample app. Make sure to change the application ID of the sample app to your own. Go to the Create a Sendbird application from your dashboard section to learn more.

You can also download the sample using a git command like the following:

Light Color Skin
Copy
$ git clone https://github.com/sendbird/SendBird-JavaScript

Run the web sample projects

There are three web sample project: basic sample, live chat sample, and widget sample. To run the sample projects, do the following to use NodeJS for your local server:

  1. Download and install NodeJS if your system doesn't have it yet.
  2. Open a terminal and move to the project path.
Light Color Skin
Copy
$ cd web-basic-sample
  1. Install packages which are used in the sample project.
Light Color Skin
Copy
$ npm install
  1. Run the sample project.
Light Color Skin
Copy
$ npm start

Run the React Native sample project

Our React Native sample project is built on the Redux pattern of React Native. To run the sample, do the following:

  1. Download and install NodeJS if your system doesn't have it yet.
  2. Setup the React Native environment in your system.
  3. Open a terminal and enter the commands below in your project path.
Light Color Skin
Copy
$ cd react-native-redux-sample/ReactNativeWithSendBird
$ npm install
  1. Run the sample app by entering the commands below.
Light Color Skin
Copy
$ react-native run-ios
$ react-native run-android

Before entering two commands above, you should run the simulator from the Android Studio in advance. The command for iOS works without further action.


How Sendbird Chat SDK works with your app

It is simple to implement chat in your client app with the Chat SDK: a user logs in, sees a list of channels, selects or creates a channel, and sends a message to the channel while receiving messages from other users within the channel.

We provide two types of channels: open and group. An open channel is a public channel anyone can participate in and chat with others. A group channel is a private channel that users can join as new members through invitation only, and has numerous distinctive properties and features compared to an open channel. There are a variety of group channel subtypes such as a public group channel working like an open channel.

All sent messages within channels are automatically delivered to channel event handlers registered to your client app. While the SendBird instance in your user's client app is connected to Sendbird server, the event handlers receive callbacks from the server through onMessageReceived(), onUserJoined(), and other methods. These callbacks contain message or channel objects with the latest information of an incoming message or other events related to the objects.