react-chat-engine-pretty

Chat Engine ✨Pretty✨

Chat Engine is a devevloper friendly and ✨pretty✨ Chat UI Kit.

Setup a free plan at chatengine.io

Features

• Typescript (since 2.0.0)
• Send messages
• Send images / files
• DMs and Group Chats

Installation

• Using npm: npm install react-chat-engine-pretty --save
• Using Yarn: yarn add react-chat-engine-pretty

Quick Start

Add serverless chat to your React app in 3 minutes.

1. Register then create a project and user at chatengine.io

2. Collect the Project ID / username / User Secret

3. Install yarn add react-chat-engine

4. Import and declare <PrettyChatWindow />

5. You're done!

Example implementation ⬇️

import React from 'react';

import { PrettyChatWindow } from 'react-chat-engine-pretty';

export function App() {
  return (
    <PrettyChatWindow
      projectId="b75e5bd5-cd84-404c-b820-06feff8c98c0"
      username="john_smith"
      secret="pass1234"
      style={{ height: '100vh' }}
    />
  );
}

Props

• projectId (String REQUIRED) - Public API key for your chatengine.io project
• username (String REQUIRED) - username of a person in this project
• secret (String REQUIRED) - Set a secret for this person and use it to authenticate.
• style (String OPTIONAL) - CSS used to customize the size of your Chat Window