Building a Realtime Chat with GraphQL Subscriptions

on YouTube ↗52m

" summary

Demonstrates building a realtime messenger that actually sends and receives messages using GraphQL Subscriptions with React and Apollo Client, wired via subscriptions-transport-ws to a Graphcool backend. Creates users and messages with mutations, subscribes to new-message events, and updates the UI via subscribeToMore so messages appear instantly; adds a serverless hook that inspects incoming messages and sends Mailgun alerts for a forbidden word. Live demo works; scaling question about ~50k connections remains implementation dependent.

AI-written summary · about

" chapters (12)

1. 0:00Start
2. 2:15What's GraphQL?
3. 4:39Example: Blogging App with REST
4. 9:42Queries
5. 11:38Mutations
6. 17:58Query Variables
7. 23:41The Stack
8. 24:09GraphQL Clients
9. 26:19Chat UI
10. 26:44React Components
11. 38:44Server-side Subscriptions
12. 44:28Resources

" related talks

• 58mCrafting compelling real-time web experiences with GraphQL and ReactRob Crowley · NDC Sydney 2018
• 24mRealtime React Apps with GraphQLRobert Zhu · React Conf 2017
• 34mGraphQL Subscriptions - Scaling real-time in the real worldUri Goldshtein · ReactiveConf 2017
• 34mGraphQL real-time subscriptionsDavid Yahalomi · Jazoon TechDays Spring 2017
• 18mCrafting compelling real-time web experiences with GraphQLRob Crowley · Decompress AU 2018
• 50mBuilding Realtime Serverless APIs with GraphQLJonathan Mills · Build Stuff 2019
• 26mEverything You Need to Know About GraphQL in 3 ComponentsEve Porcello · React Rally 2018
• 01h 04mBuilding real-time API's with GraphQLSandeep Singh · NDC London 2018