Typing terminals in the hero without a framework

The landing page hero types a command, streams output a line at a time and pauses on a choice. The scenarios live in template elements in the markup, and a run token keeps fast tab clicks from interleaving.

Putting the copy in template elements keeps the script generic: it clones a scenario, types the command with a per-character delay, then appends the lines with pauses read from a data attribute. A nested template holds the follow-up lines for each answer to a choice.

Every run increments a token and checks it before each step, so a newer run invalidates the older one. That is the whole concurrency model, and it is enough. Reduced motion skips the typing and prints the final state.

All posts