Sendbird JavaScript SDK v3 samples

Deprecation Note (v3)

:warning: Please note that Sendbird’s SDK v3 will be deprecated by July 2023. You may still use the older SDKs at your choice, but no new updates or bug fixes will be made to SDK v3.

We recommend clients to plan their migration to SDK v4 as early as possible as there are breaking changes. We also provide prioritized support for migration and any issues related to v4. SDK v4 provides far richer and robust features in Websocket, Local caching, Polls, Scheduled Messages, Pinned Message, and many more. So try it out now! (Chat SDK v4 react samples)

<br />

🔒 Security tip

When a new Sendbird application is created in the dashboard the default security settings are set permissive to simplify running samples and implementing your first code.

Before launching make sure to review the security tab under ⚙️ Settings -> Security, and set Access token permission to Read Only or Disabled so that unauthenticated users can not login as someone else. And review the Access Control lists. Most apps will want to disable "Allow retrieving user list" as that could expose usage numbers and other information.

Introduction

This repository contains samples for how to use Sendbird to add chat using Javascript, React and React Native. You can find more information in the Javascript SDK documentation and React Quickstart Documentation

React

Sendbird UIKit for React is a set of prebuilt UI components that allows you to easily craft an in-app chat with all the essential messaging features. Our development kit includes light and dark themes, text fonts, colors and more. All the included components can be styled and customized to create an unique experience that fits your app.

• Basic React App is a quickest way to get started using UIKit

• Composed React App demonstrates how to use the various smart components.

• Custom React App shows how to customize the Message, ChannelPreview, and UserList UI elements.

React Native

The Sendbird React Native framework allows you to simplify development for iOS and Android apps, and reuse the same code on both web and mobile apps.

• React native Redux shows how to use Sendbird with React Native on iOS and Android.

• React native Redux Syncmanager Expands on the above sample and implements the Sendbird SyncManager

• React Native Hooks Implements Sendbird on iOS and Android using the hooks pattern.

JavaScript

• JavaScript chat sample is a Slack-like full screen chat sample for desktop browsers using both Group channels and open channels.

• JavaScript widget sample is a Facebook-chat-like chat widget for websites.

• JavaScript live chat sample is a Twitch-chat-like experience.

• JavaScript chat sample with SyncManager is a web chat sample integrated with Sendbird SyncManager document, adds local caching to the core chat features. For faster data loading and caching, the sample synchronizes with the Sendbird server and saves a list of group channels and the messages within the local cache into your client app.

Installation

To use the Sendbird Chat SDK directly you can install it through npm or yarn with

npm install --save sendbird

or

yarn install --save sendbird

Or download the latest release manually from GitHub

Getting Help

Check out the UIKit for React docs. and Sendbird's Developer Portal for tutorials and videos. If you need any help in resolving any issues or have questions, visit our community forums.

We are Hiring!

Sendbird is made up of a diverse group of humble, friendly, and hardworking individuals united by a shared purpose to build the next generation of mobile & social technologies. Join our team remotely or at one of our locations in San Mateo, Seoul, New York, London, and Singapore. More information on a careers page.