Websocket Demo

Demonstrates websocket architecture when traversing several layers

.--------.      .----------.      .----------.
| CLIENT | <--> | SERVER A | <--> | SERVER B |
'--------'      '----------'      '----------'

Most websockets examples show a connection between a client and server. This repo is an example of a client, server to server websocket. You may need this pattern if you have middleware that connects your client and serverside code.

Table of Contents

• Installation
• Clone
• Setup
• Technology
• License

Installation

• Node v8.16.2
• React v16.12

Clone

• Clone this repo to your local machine using https://github.com/jscho13/server-to-server-websockets

Setup

Download dependencies for both client and server

$ npm install
$ cd ./frontend && npm install

Usage

Start the backend dummy service

$ cd backend
$ node backend.js

Run the express middleware dummy service

$ cd ../middleware
$ node middleware.js

Start client side react

$ cd ../frontend
$ npm start

Technology

• Socket.io is a nifty library that enables real-time, bidirectional and event-based communication. It's not a replacement for Websockets, but includes it and falls back to other techniques like long polling when it fails
• Client is a React app that utilizes client code Socket.io to connect to middleware
• Middleware is an express server that uses server-side Socket.io to create a websocket on port 4001
• Backend is a microservice that exposes a websocket on a single port 4000
• I utilized this nifty Markdown Cheatsheet for this sample README.

License

• MIT license
• Copyright 2019 © Joseph Cho.

https://user-images.githubusercontent.com/8882123/111056287-cf48cb00-844b-11eb-9c14-07f3a04af031.png https://user-images.githubusercontent.com/8882123/111056236-7c6f1380-844b-11eb-86cb-54800e352999.png