Skip to content
Create CometChat app with typing indicators
JavaScript CSS HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

React Chat App With Typing Indicator Using CometChat PRO

This sample app shows how to build a React chat application using CometChat Pro SDK that will show typing indicator when another user is typing a message


Typing indicator 1 Typing indicator 2

Jump straight into the code or read the accompanying step-by-step guide here on our blog.


This demo uses:

  • React
  • CometChat Pro JavaScript SDK
  • Typing animation in CSS by Jimmy Yoon

Running the demo locally

  • Download the repository here or run git clone
  • In the react-typing-indicators directory, run npm install
  • You need to sign up for CometChat PRO and create your application first
  • Create an ApiKey. You can use auth-only permission for this application
  • Create a Group from the dashboard
  • Create a .env file in the root folder of the project and paste the following content in it:

Replace YOUR_API_KEY, YOUR_APP_ID and YOUR_GROUP_GUID with your API KEY, APP ID and GUID as obtained from your CometChat dashboard.

  • run npm start

Useful links

Other examples

You can’t perform that action at this time.