Skip to content

Latest commit

 

History

History
49 lines (34 loc) · 1.64 KB

README.md

File metadata and controls

49 lines (34 loc) · 1.64 KB
Raw

React Chat App With Custom Commands and Webhooks

This full-stack tutorial shows you how to create a chat app using Stream's React Chat SDK and incorporating Stream Webhooks to enable custom /slash commands.

To show you how to create custom commands, you'll integrate Google Sign-In and retrieve events from a Google calendar with the command /gcal.

Getting Started

If you want to follow along, you'll need:

Quickstart

To run this project locally:

  • Clone this repo:
git clone https://github.com/ZPain8464/google-int-react-be.git
  • Install dependencies
npm i

  • Add your Stream API Key, Secret, and App ID to your .env file

  • Add your Google Client ID, Secret, and Redirect URL to your .env file

  • Run the following scripts to create your database:

$ sqlite3 database/proj.db
$ .read database/db.sql
  • Create your webhook URL:
  1. Go to your Stream dashboard
  2. Select your app
  3. Select Chat > Overview in your nav menu
  4. Under Realtime in the Webhook URL field, enter your ngrok URL with /auth/handlewebhook (e.g. https://XXX.ngrok.io/auth/handlewebhook)
  5. Click Save
  • Under setupcommands in controllers/auth.js, update your ngrokUrl with the webhook url you specified in your Stream dashboard.

You're ready to go!