Reviving the Retro: A Modern Twist on Classic Terminals

In the digital age, it's easy to overlook the charm of vintage technology. However, one Reddit user, Remojansen, decided to bring back the nostalgia of old cathode ray tube (CRT) displays with a unique project.

The Inspiration: A Love for Retro Aesthetics

During the holidays, Remojansen stumbled upon an open-source terminal named cool-retro-term that emulated the visuals of old CRT displays. The retro sci-fi atmosphere reminded him of popular fictional universes like Alien and Fallout. Inspired, he wanted to recreate this look for his personal website.

The Challenge: Porting from QML to Web Technologies

Upon examining the source code, Remojansen realized that the terminal was implemented using QML and C++. Being new to these technologies, he wondered if it was possible to port it to web technologies using WebGL or Emscripten. With the help of GitHub Copilot, he decided to try the WebGL route due to fewer technical challenges.

Understanding the Architecture

Despite having no experience with QML, Remojansen was able to understand the architecture of the original source code with the help of GitHub Copilot. He cloned the repository, added a new web directory, and began providing instructions to an LLM named Claude.

The Development Process

• Step 1: The Static Frame: Remojansen asked Claude to implement the static frame using Three.js while ignoring terminal emulation for now.
• Step 2: Text Rendering: Claude was then asked to render basic text from a hardcoded text file in the Three.js scene using the appropriate retro font.
• Step 3: Migrating the Visual Effects: Claude started migrating the visual effects, starting with the background noise and moving on to other effects like Bloom, Brightness, Chroma, RGB Shift, Screen Curvature, Burn-In, Flickering, Glowing Line, Horizontal Sync, Jitter, and Rasterization.
• Step 4: Integrating Xterm.js: Once the terminal frame and effects were ported from OpenGL to WebGL, Claude was asked to replace the hardcoded text with the output of Xterm.js, an open-source project designed for web-based terminals.
• Step 5: Building Games: Remojansen asked Claude to implement multiple text-based games such as Pong, Tetris, Snake, Minesweeper, Space Invaders, and Arkanoid.
• Step 6: Adding Media Playback with ffplay: Remojansen wanted to add support for playing audio and video files directly in the terminal, similar to how ffplay works in a real terminal.
• Step 7: Refactoring and Publishing: The final step was to refactor the code to separate the library code (the WebGL retro terminal renderer) from the application code (the terminal emulator and games), with the goal of publishing the WebGL terminal renderer as a standalone npm module.

The Result: A Modern Retro Terminal

The entire implementation took around 10-15 hours. Without an LLM, it would have taken Remojansen several weeks. The cost savings enabled by Claude Opus were significant, as the project cost him roughly $10.50, a fraction of what it would have cost with traditional development methods.

Implications for North East India and Beyond

This project showcases the potential of AI-assisted development tools like GitHub Copilot and LLMs. For developers in North East India and across the country, such tools can help bridge the gap in learning unfamiliar technologies and accelerate project development.

Moreover, the resulting WebGL terminal renderer can be used as a standalone npm module, opening up possibilities for other developers to incorporate retro aesthetics into their web applications.