I really wanted to learn React & Tailwind (and Next.js along the way) so I decided to make a recreation of an actual machine panel. There is so much detail and I hope to maybe make it a functional interface for the gcode parser project I have going to be able to virtually run programs. 🤯
When visited directly to the homepage, the machine will be powered off. You can press (click) any of the display keys (group of 8 on the bottom right of the keyboard) to activate a screen. Screens can also be permalinked via query param as follows:
| Screen | Link |
|---|---|
| Program Page | ?screen=PROGRAM |
| Position Page | ?screen=POSITION |
| Offset Page | ?screen=OFFSET |
| Settings Page | ?screen=SETTINGS |
| System Page | ?screen=SYSTEM |
| Messages Page | ?screen=MESSAGES |
| Graph Page | ?screen=GRAPH |
| Handyman Page (Custom 1) | ?screen=CUSTOM_1 |
| Webapp Settings (Custom 2) | ?screen=CUSTOM_2 |
- softkey
a9will toggle the machine controls on/off - the mode keys in the controls should reflect in the program page


