Fancy React/TypeScript app from Teensy Web server

[khupys]

I have been using LabView to control my lab setup for years. But you all know LV is ugly and expensive, and wastes a lot of resources just to do simple things like USB communication to power supplies, pulse counters, picoammeter, etc.

By the way, I have fancied beautiful React/TS app running on JavaScript engine on web browser for my lab setup control.

So, I ended up building this setup (mostly by vibe coding using Gemni 3):

1. The Teensy board runs a web server. (Needs an Ethernet connection, obviously). When you hit it with a web browser, the Teensy serves up a React/TS bundle stored in its flash memory, which the browser’s JS engine then runs.
2. Frontend-Backend Sync: From there, the React frontend in the browser communicates with the Teensy over Ethernet. The Teensy handles the hardware control and data acquisition, while the browser app handles the graphing, calculations, and file saving.
3. Standalone Operation: As long as the Teensy has power and a network cable, it’s completely stand-alone. It handles all the instrument control while talking to the external browser. This means anyone with a computer and a browser can run this experimental equipment.
4. Remote Access: Technically it runs on the LAN, but with some clever router port forwarding, you could run experiments from the other side of the planet.

You first need to do the frontend app running, and then include it into your .ino file before compiling and uploading.
A bit involved, but once done, the results looks very nice as seen in the screenshot included.
Teensy is indeed very very powerful !!

Yongsup Park