/express-chat-client

A React practice project to go with an Express chat backend

Primary LanguageTypeScriptMIT LicenseMIT

express-chat-client

A React practice project to go with an Express chat backend.

A website showing a panel that asks the user for their name A website showing a panel that displays an ongoing chat transcript

Interface for the server

The list of supported events combined with the list of expected objects are summarised below. These are shared with the backend; using a Git submodule or npm/pnpm package would be better design, but is out of scope of this.

Event Object
greeting Greeting
chatMessage ChatMessage
typing TypingMessage
userList UserStatusMessage
disconnection UserStatusMessage
connection - (no message)
newUser BaseMessage

Running locally

Depending on your package manager:

pnpm

  • pnpm install
  • pnpm run dev

npm

  • npm install
  • npm run dev

Authentication

The client will make a REST call to the backend for an auth token before opening the chat.

ESLint configuration

The @typescript-eslint/no-explicit-any rule has been disabled due to difficulties in defining interfaces for certain parameters within the Client.ts file. All other rules are as per the default. There is a dedicated build file for this.