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.
If you want to follow along, you'll need:
- A free Google Cloud Platform account and Stream account.
- A free Stream account
- A free ngrok account
To run this project locally:
- Clone this repo:
git clone https://github.com/ZPain8464/google-int-react.git- Install dependencies:
npm i-
In your
.envfile, add your Stream API Key and Google Client ID -
Run
npm start -
Create your webhook URL:
- Go to your Stream dashboard
- Select your app
- Select Chat > Overview in your nav menu
- Under Realtime in the Webhook URL field, enter your ngrok URL with
/auth/handlewebhook(e.g.https://XXX.ngrok.io/auth/handlewebhook) - Click Save
- See the backend repo to wire up with your endpoints.