Setup
Initialize Socket
The first step is to initialize the Socket. It manage the basic
configuration for connection to the server and all the sub-systems. We start by determining the url of our server.
/src/server/socket.ts
import { Socket } from "@hyper-fetch/sockets";
export const socket = new Socket({ url: "ws://localhost:3000" });
Create Listener
Then, having already prepared connection setup for the server, we use the socket method to create Listeners and assign types to them.
type ChatMessageType = {
message: string;
};
export const onChatMessage = socketInstance.createListener<ChatMessageType>()({
endpoint: "chat-message", // endpoint of the event
});
Create Emitter
Then, having already prepared connection setup for the server, we use the socket method to create Emitter and assign types to them.
import { socketInstance } from "./socket";
type ChatMessageType = {
message: string;
};
// Optional
type AcknowledgementResponseType = {
value: string;
};
export const sendChatMessage = socketInstance.createEmitter<ChatMessageType, AcknowledgementResponseType>()({
endpoint: "chat-message", // endpoint of the event
});