Quick Start

SendBird helps you to implement real-time chat to any application with speed and efficiency. Our Javascript SDK provides you with various methods to initialize, configure and build the chat from the client side - no server side implementation required because our reliable infra management service is delivered with the SDK. This section presents a brief overview of the SDK’s functionalities and logic, then let you go through the preliminary steps of implementing SendBird in your own application


Create a new SendBird application in the Dashboard

The first thing to do is to sign in to the SendBird Dashboard and create a SendBird application. If you do not have an account yet you can sign up with Google, GitHub, or create a new account.

You can create one application per service, regardless of the platform. For example, an app released in both Android and iOS requires only one application to be created in the Dashboard.

All users within the same SendBird application can communicate with each other, across all platforms. This means users using iOS, Android, web clients, etc. can all chat with one another. However, users in different SendBird applications cannot talk to each other.

XSS (Cross Site Scripting) Prevention

Cross-site scripting (XSS) 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 type of string data without restriction through SendBird. Please keep in mind to 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.


Run the sample

Download the latest SendBird JavaScript sample.

Or download/clone the sample by using git.

Git clone
$ git clone https://github.com/smilefam/SendBird-JavaScript

Run sample project

You need a local server to run the sample project. In this example, we'll be using NodeJS to run our local server.

  1. Download and install NodeJS if you don't have it installed in your system.
  2. Open a terminal and move to project path (The following code is example as web-basic-sample)
    $ cd web-basic-sample
  3. Install package which use in sample project
    $ npm install
  4. Run the sample project
    $ npm start

Integrating SendBird with an existing app

Download the latest SendBird JavaScript SDK

$ bower install sendbird
$ npm install sendbird

Add the SDK file to your project

Download the SendBird JavaScript SDK file and add it to your Project classpath (generally the libs/ directory). Then include the JavaScript file on your page.

<script src="lib/SendBird.min.js"></script>

Supported Browsers

Brower Supported versions
Internet Explorer 10 or later
Edge 13 or later
Chrome 16 or later
Firefox 11 or later
Safari 7 or later
Opera 12.1 or later
iOS Safari 7 or later
Android Browser 4.4 (Kitkat) or later

Running the 3.0 sample in React Native

  1. Download and install node and npm.
  2. Clone the sample project from GitHub.
    $ git clone https://github.com/smilefam/SendBird-JavaScript
  3. Open a terminal and run the following commands in your project path.
    $ cd react-native-sample/SendBirdReactNativeSample
    $ npm install
    $ npm install -g react-native-cli
  4. Run the sample app in an iOS simulator.
    $ react-native run-ios
  5. Run the sample app in an Android simulator. Before running this command, you must run the simulator from Android Studio.
    $ react-native run-android

Parameter ordering in callbacks

In a callback, the error parameter is passed last in order by default. For example, connect() below returns parameters in (user, error) order.

sb.connect(userId, function(user, error) {});

It is possible to configure SendBird to change this order by calling sb.setErrorFirstCallback(true). Once true is set, all callbacks pass the error as the first parameter.

sb.setErrorFirstCallback(true);
sb.connect(userId, function(error, user) {});

sb.setErrorFirstCallback(false) returns callbacks to their original parameter ordering, with errors last.


Using functions of SendBird object with Immutable-js

If you're using Immutable-js in your products, instead of Immutable.Map(), use Immutable.fromJS() which converts deeply nested objects to an Immutable Map.
You can call functions in the SendBird object, Because fromJS() returns internal objects. But if you use Map function, you can't call SendBird function.

var userIds = ['unique_user_id1', 'unique_user_id2']; 
sb.GroupChannel.createChannelWithUserIds(userIds, false, name, coverUrl, data, function(createdChannel, error) {
    if (error) {
        console.error(error);
        return;
    }
    var immutableObject = Immutable.fromJS(createdChannel);
    console.log(immutableObject);
});