Hey! How do I integrate websockets or Socket.io into my project? Particularly to add a live chat functionality on one of my pages? This is my first time using Plasmic from my codebase and I haven’t seen really any information on this kind of integration with Plasmic. Any info would be much appreciated.
Long Live Plasmic.
Hi @a_vaughn, we don’t have a specific example of integrating Socket.io with Plasmic, but it shouldn’t be too different from integrating with any other React/NextJS codebase! They have pretty good documentation, for example: How to use with React | Socket.IO
The best way to integrate partly depends on the type of project (is it a Plasmic loader or codegen project), and how you plan to host it. You can either run a separate Socket.io, or directly in the Next.js server.
Either way, you’d probably want to implement something like a ChatWidget and register it as a code component, then add it to your pages in Plasmic. It would to something like:
Fetch autn token → connect socket → join chat room
Listen for messages
Emit message send events
On unmount leave the room (but maybe keep socket alive)
First, Thanks a bunch for the answer. The only other question I have is wether I could build that kind of component within the Plasmic editor, maybe using a data fetcher or graphql fetcher, or do I just have to import an external component? Thanks again