Node.JS Chat Server on an ESP32 Microcontroller

chat-server-mobile-screens.gif

Running a group chat server on the Node.js based Neonious One

The Neonious One is a IoT board which utilizes the ESP32 microcontroller. It’s programmable directly on the chip with an onboard IDE using JavaScript and the Node.JS API.

Neonious One IoT Board

I wanted to create a system for a  group to communicate where there is no internet or mobile phone coverage. The low power usage of ESP32 based microcontrollers means the device could be powered from a USB powerbank or small solar panel.

Code

The files are grouped into two folders. The src folder contains the server-side JavaScript. The www folder contains the resource files for the front end of the application. There’s also a chat-history.json file in the root. This is a JSON formatted file containing previous messages.

IDE File Explorer

WebSocket Library

The app uses the Node.js WS websocket library, This is easily installed using the IDE package manager

Websocket Client Install

Server Side JS

The JavaScript code found in the index.js file in the src folder that runs on the microcontroller. You can see this code in the JavaScript tab here: https://jsfiddle.net/53qL14ko/

Client Side HTML

This the HTML and JavaScript code that  displays the chat on the client browser (the index.html file in the www folder). You can see this code in the HTML tab here: https://jsfiddle.net/53qL14ko/

I’ll add a download of the full application and explain aspects of the code later.

I’ve used a simple click your picture to login system. In a finished application this could be replaced with a proper authentication method.

Chat Avatars

Demonstration with Four Users

The video below shows the chat working with four users. Laura, Warren, Tony and Alaska:

There is no security or input checking at the moment but it is completely functional and could be used for group chats in remote locations.

References

Neonious One website: https://www.neonious.com/neoniousOne
Lowjs chat server example: https://github.com/neonious/lowjs/tree/master/examples/chat_ws_webserver
Node.js WebSocket library: https://www.npmjs.com/package/ws https://github.com/websockets/ws
Design inspiration and some CSS: https://codepen.io/drehimself/pen/KdXwxR
Avatars: https://www.flaticon.com/packs/avatars-4

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

scroll to top