Preparation

Install Node.js

See How to install Node.js?.

Note:
You need npx to run commands later. npx comes pre-installed with npm (Node Package Manager) starting from npm version 5.2.0.

This project uses node v20.11.0 and npm 10.2.4.

Pick an editor

Pick your favorite editor or use Visual Studio Code.

Learn React basics

If you're not familiar with JavaScript, you may try this tutorial: "Quick Introduction to JavaScript."

Learn HTML basics: Introduction to HTML

Learn CSS basics: Learn to style HTML using CSS

If you're not familiar with React, try to learn here: "Quick Start - React."

What is Websocket?

The WebSocket API is an advanced technology that makes it possible to open a two-way interactive communication session between the user's browser and a server. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply.

What is Socket.IO?

Socket.IO is a library that enables low-latency, bidirectional and event-based communication between a client and a server. In most cases, the connection will be established with WebSocket, providing a low-overhead communication channel between the server and the client. In case the WebSocket connection is not possible, it will fall back to HTTP long-polling.