Skip to content

Latest commit

 

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

TSTUI - Terminal Style User Interface

A web-based terminal UI powered by TypeScript. Configure it with a TOML file, run it locally, and interact with a retro terminal in your browser.

Features

  • TOML configuration — server port/host, terminal colors, font, prompt, and menu items all driven by config.toml
  • Interactive web terminal — type commands or click menu buttons to get terminal-style responses
  • Built-in commandshelp, about, clear, date, echo plus any custom commands defined in the menu
  • Lightweight — zero frontend framework dependencies; plain HTML, CSS, and JavaScript

Prerequisites

Quick Start

npm install
npm run build
npm start

Open http://127.0.0.1:8080 in your browser.

Development

For hot-reload during development:

npm run dev

Configuration

Edit config.toml in the project root:

[server]
port = 8080          # Port to listen on
host = "127.0.0.1"   # Bind address

[terminal]
title = "TSTUI Terminal"
prompt = "$ "
font_size = 14
background_color = "#0d1117"
text_color = "#00ff00"
accent_color = "#58a6ff"
font_family = "'Courier New', Courier, monospace"

[[menu]]
name = "Help"
command = "help"
description = "Display available commands"

[[menu]]
name = "Date"
command = "date"
description = "Show current date and time"

Add as many [[menu]] entries as you like. Each appears as a clickable button in the terminal menu bar and as a recognized command.

Testing

npm test
npm run test:watch   # watch mode

Project Structure

├── config.toml           # Configuration (TOML)
├── package.json          # Dependencies and scripts
├── tsconfig.json         # TypeScript configuration
├── src/
│   ├── index.ts          # Entry point
│   ├── config.ts         # Config loader with defaults
│   ├── server.ts         # Express HTTP server
│   └── public/
│       ├── index.html    # Terminal UI layout
│       ├── style.css     # Terminal styling
│       └── script.js     # Frontend command handler
├── tests/
│   ├── config.test.ts    # Config loading tests
│   └── server.test.ts    # Server endpoint tests
└── dist/                 # Compiled output (generated)

Disclaimer

TSTUI is simply meant as an example, or a starting point. It was created using AI models as a bit of an experiment. Obviously not for production, but education.

License

MIT

About

a typescript terminal user interface example

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages