Easy way to get 15 free YouTube views, likes and subscribers
Get Free YouTube Subscribers, Views and Likes

Realtime Chat App with NextJS GraphQL NodeJS MongoDB Prisma TypeScript (iMessage Clone) 💬🔥 | P3

Follow
Shadee Merhi

Repo link: https://github.com/shadeemerhi/imessa...

❤ Tips & Donations Link: https://paypal.me/shadeemerhi?country...
( Thank you very much for your support!)

❗This video is Part 3 of a multipart series. I'm currently working on the new parts and am planning to release them every 47, so be sure to subscribe for those!

❗ Please comment with any feedback, questions, or concerns!
JOIN MY DISCORD FOR DIRECT ACCESS TO ME! I WANT TO HELP YOU!   / discord  

Build Technologies:
✅ NEXTJS
✅ APOLLO GRAPHQL
✅ CHAKRA UI
✅ NODEJS
✅ MONGO DB
✅ PRISMA

Mentioned Links:
ConversationItem Component: [https://github.com/shadeemerhi/imessa...](https://github.com/shadeemerhi/imessa...)

FeedHeader Component: [https://github.com/shadeemerhi/imessa...](https://github.com/shadeemerhi/imessa...)

formatUsernames Function: [https://github.com/shadeemerhi/imessa...](https://github.com/shadeemerhi/imessa...)

Part 3 Chapters:
0:00 Intro & Preface
1:05 Database Modelling & Prisma Schema
21:39 createConversation Resolver (Prisma Create & Prisma Validator)
36:30 Storing Conversations & Participants
43:55 Redirecting Users w/ Next.JS Router
50:21 Conversations Query 1 (conversations Resolver definition, ConversationFields typeDefs)
59:46 Conversations Query 2 (conversations useQuery, Prisma TypeScript Types)
1:11:13 Conversations Query 3 (conversations Resolver completion, fetch conversations)
1:17:17 ConversationItem Component Creation
1:21:46 Subscriptions & WebSockets w/ Apollo Client (graphqlws, wsLink, splitLink)
1:27:35 Subscriptions & WebSockets w/ Apollo Server (WebSocket Server, Subscription endpoint & Context)
1:42:34 conversationCreated Subscription Backend (Publish/Subscribe Pattern, PubSub Class)
1:47:43 conversationCreated Subscription Frontend (subscribeToMore function, updateQuery)
1:57:38 Testing the conversationCreated Subscription
2:04:09 conversationCreated Subscription Troubleshooting (fixing typeDefs)
2:07:10 Filtering Subscription Events (withFilter function)
2:16:16 ConversationItem & FeedHeader Components
2:36:50 Outro & Part 4 Preface

#react #javascript #softwareengineer

posted by Kosellekm7