I Built a Browser-Based Terminal with 102 Developer Tools

Source: Dev.to

The Idea

I wanted a single place to run quick developer tasks—subnet calculations, Base64 encoding, DNS lookups, hash generation—so I built administrator.sh, a browser‑based terminal with 102 commands. It feels like a classic terminal but runs entirely in the browser.

Command Categories

Network Tools

dns, whois, rdns, ping, traceroute, headers, ssl, port, subnet, cidr, asn, mac, myip, geo, http
These are the tools I reach for daily. Example: dns example.com returns A, AAAA, MX, NS, TXT records instantly. ssl example.com shows certificate details, expiry date, and chain info. headers fetches and displays HTTP response headers.

Encoding & Dev Utilities

base64, hash, json, urlencode, regex, jwt, uuid, password, chmod, cron, timestamp, calc, diff, ascii, case, sort, reverse, number, color, workdays
Most used: json validates and pretty‑prints JSON, regex tests patterns with match highlighting, cron parses cron expressions.

BBS‑Style Social Features

chat, irc, board, msg, who, bulletin
A real‑time chat room, an mIRC‑style interface, a message board, direct messaging, and a who command that shows who’s online. It’s essentially a modern BBS inside a terminal.

Games

adventure, battleship, blackjack, chess, connect4, hangman, minesweeper, snake, tictactoe, wordle, hack
Includes a text adventure, multiplayer Battleship, and a hacking simulation.

System & Account

login, register, account, 2fa, apikey, notifications, support, theme, crt, help, history, clear
Users can optionally create accounts for persistent features (saved preferences, message history, 2FA). Most tools work without an account.

Architecture

• Backend: Flask (Python) with SQLAlchemy + MySQL — ~5,400 lines in a single app.py.
• Frontend: Vanilla JavaScript; 102 command files bundled with esbuild into terminal.bundle.js.
• CSS: Custom properties for theming, no preprocessor.
• Server: Gunicorn with gevent (single worker, 1,000 concurrent connections).
• Infrastructure: Nginx reverse proxy, Cloudflare Worker for geographic routing.

The UI is a minimal HTML page that loads the bundled JavaScript; everything else is JavaScript appending lines of text. No framework is needed.

Example Command Module

// static/js/commands/hash.js
export default {
  name: "hash",
  description: "Generates a SHA-256 hash of the input.",
  usage: "hash <input>",
  category: "encoding",

  run({ print, arg, createPrompt, handleCommand }) {
    if (!arg) {
      print("Usage: hash <input>");
      return createPrompt(handleCommand);
    }

    const encoder = new TextEncoder();
    const data = encoder.encode(arg);

    crypto.subtle.digest("SHA-256", data).then(buffer => {
      const hashArray = Array.from(new Uint8Array(buffer));
      const hashHex = hashArray.map(b =>
        b.toString(16).padStart(2, "0")
      ).join("");
      print("SHA-256: " + hashHex);
      createPrompt(handleCommand);
    });
  }
};

Each command receives the same context object (print, arg, createPrompt, handleCommand). Adding a new command is as simple as creating a file and importing it.

Real‑Time Features

• Chat polls every 2 seconds.
• Visitor count polls every 10 seconds.
• Polling is preferred over WebSockets to avoid connection‑management complexity and proxy issues.

Standalone Tool Pages

Located at administrator.sh/tools/ and indexed by Google:

• Subnet Calculator
• Base64 Encode & Decode
• Hash Generator
• JSON Formatter
• Regex Tester
• Chmod Calculator
• Cron Parser
• Password Generator
• UUID Generator
• URL Encode & Decode

Each page loads a single ~5 KB JavaScript file; all processing happens client‑side, so data never leaves the browser.

Lessons Learned

1. Polling is underrated. Simpler than WebSockets for low‑frequency updates.
2. One file per command scales well. Even with 102 commands the codebase remains easy to navigate.
3. In‑memory state suffices for ephemeral data. Chat messages, online status, and board posts live in Python dictionaries.
4. CSS custom properties make theming trivial. Six themes require only a class change on the root element.
5. gevent shines for I/O‑bound Python. A single Gunicorn worker with gevent handles 1,000 concurrent connections smoothly.

Getting Started

Visit administrator.sh and type help to see all 102 commands, or explore the standalone tools if you prefer a traditional UI.

A few commands to try

• dns google.com — DNS lookup
• subnet 192.168.1.50 192.168.1.0/24 — Subnet check
• json {"name":"test"} — Format JSON
• who — See who else is online
• chat — Join the chat room
• adventure — Play a text adventure
• theme — Change the color scheme
• crt — Toggle CRT scanline effects

Everything runs in your browser. No signup, no install, no tracking.