Back to Text UI
summary
Builds a working Midnight Commander clone rendered from HTML/CSS/React into a real terminal, using the browser layout engine as a measurement backend. Measures boxes with getComputedStyle/getClientRects and text with document.createRange, rasterizes into three layers (background, border, text), sends frames via Socket.IO to stdout, replays stdin events into the DOM, and patches React’s reconcile transaction to capture updates. Demo scrolls, resizes, supports coloring via highlight.js, is a proof of concept that mostly works though the demo glitches and font rendering needs polish.
AI-written summary · about
chapters (5)
related talks
05mReact for Command-Line Interfaces! (feat. Ink)
28mWriting command-line interfaces (CLIs) with React. Wait, what? Yeah!
32mReact Runs Your Terminal: Let’s Build One Live
21mReact Beyond the DOM
34mBuilding React From Scratch
38mReact as a Developer Health Tool
33mBless You My Dev
29mEvolving the Visual Programming Environment with React