Teach Terminal

A browser-based game that teaches Linux terminal commands through interactive lessons and missions.

Today

Today I added redirection to the terminal. Commands can now read from files and write to them instead of only printing to the screen.

The terminal now supports:

• > - write output to a file (overwrites)
• >> - append output to a file
• < - read input from a file
• 2> - redirect error output to a file

I also connected < to cat so it can read from a file through stdin.

To make this work, I had to refactor how commands run. The old processCommand returned output directly. I renamed it to executeCommand and wrote a new processCommand wrapper above it that parses redirection operators before the command runs, then decides where the output goes.

The refactor was harder than expected. I hit several bugs - a typo in stderrMatch, a missing $ anchor in a regex, and a duplicate if block that used the wrong variable. I also had to fix catResults and lineNumber which I deleted during the refactor without realizing.

Completed

• index.html - Start menu with Start and Settings buttons
• settings.html - Settings page with three themes (Ubuntu, Hacker, Kali)
• login.html - Login page with username, machine name, and password validation
• main.html - Interactive terminal interface
• style.css - Main styling, animated gradients, glassmorphism UI, and theme colors
• login.css - Login page styling with themed backgrounds
• settings.js - Saves the selected theme using localStorage
• theme.js - Loads the saved theme and applies it automatically
• login.js - Form validation and redirect to terminal
• filesystem.js - Fake Linux filesystem with files, folders, permissions, owners, groups, sizes, and modification times
• terminal.js - Terminal input handling, prompt display, line management, colored output
• commands.js - Command recognition and execution

Current Commands

pwd, ls, cd, mkdir, touch, echo, cat, rm, cp, mv, clear, help

With flags for most commands, redirection (>, >>, <, 2>), and per-command help.

Goal

My goal is to create a realistic Linux terminal that teaches beginners how to use common commands through interactive lessons instead of just reading documentation.

Next Steps

• Command history (up/down arrow keys)
• Tab autocomplete
• history command, !!, !n
• Add grep, head, tail
• Add chmod, chown
• Wildcards, brace expansion, &&, ||
• Build the lesson system (lectures + practice missions)

Try It

Live Demo