Just redesigned my personal site with a TTY-style interface
97 comments
·May 2, 2025maze-le
claiir
Maybe just have commands auto-execute if you click on links in the existing text? That would allow someone to experience the entire interface on a touch device! :>
E.g. there is **__contact__** in the page, bold and underlined, but you cannot click on it to do anything.
aquariusDue
Good point, another solution might be something similar to https://ysap.sh/ which gives you a nice "page" formatted for the terminal when curl'ed and your usual HTML and CSS on the browser.
hliyan
+1 for ls and cd. I would also suggest numbered output for ls, so that the user can select using the numeric keypad. Or, up/down nav, TUI-style. I wish ecommerce sites could be more like this.
doubled112
I miss real pages on eCommerce sites.
xtiansimon
I’ve trained bookkeepers to run Python scripts on Windows, and ls/dir, cd are foundational, including the syntax for a script command’s arguments.
For the clear text version, it could be a hypertext document run by an app! Haha
oriel
I did something like this, in a much more limited form, when putting together my personal site a few weeks ago. https://1ps0.info/
I had a friend try to run 'sudo shutdown -r now'. It inspired a much more thorough approach to the terminal functionality, but I didnt want to rabbit hole too far.
As it stands, initially it was a cyberpunk theme but i wanted a vscode-like professional theme as default, so you can toggle between them through cli. Lots of fun to be had with eastereggs.
swyx
also dont forget SEO...
noduerme
er, I assume that they made this site because they're far too good to work for anyone who doesn't want to take the time to find out how it works. In other words, recruiters need not apply.
MOARDONGZPLZ
I would love to hire this person (in theory), but every job I post gets hundreds of inbound applicants, and while hiring is one of the most important aspects of my job, it is second to delivering software with value. I really don’t have time to seek out every person out there who may have a resume, much less a quirky resume, so I send recruiters who work for me to find good candidates for top of funnel. I don’t think there is anything wrong with this.
Philpax
I'm going to represent the critical opinion and say: this is cute and I like the idea in theory, but if I encountered this in the wild, I would just leave the page. I explore most informational websites with a mouse or a touchscreen - I don't want to type to navigate your website!
A middleground might be to make the commands clickable, so that clicking on "help" automatically inserts and runs it, and clicking on any of the commands in "help" does the same. You would still frustrate users who would have to keep scrolling up to reach the navigation, but it would make it usable without a keyboard.
washadjeffmad
The front page of our early phreaking zine was an interactive cellphone- a certain famous model of Motorola- that you had to navigate to enter.
It was a great filter against people who wouldn't have understood the content. If you knew how this model worked, there were a lot of easter eggs, and we received a lot of great feedback to make it more fun and rewarding.
Being told that it would "frustrate users" would have elicited a friendly "Not ours :)".
Philpax
Absolutely! I very much respect that; some things are meant for a specific audience, and that's OK.
That being said, it looks like this website is meant to serve as a portfolio and a self-introduction - and for that, you generally don't want to alienate the entirety of your mobile audience :sweat_smile:
dgimla20
It's a cool looking site, but these terminal style sites (seen a few of them from web developers and software types) look terrible on phones and tablets (keyboard constantly present), which is well over 60% of web traffic now.
You have to keep in mind your audience. If you presume everybody visiting this site is software-inclined, it's fine. I know a lot of less tech-literate users who would leave something like this straight away thinking they're being hacked or something daft.
null
andyjohnson0
Agree. While I acknowledge the work that must have gone into this, and the playful quality of the result, with respect this is a frustrating way to present information.
Personally I'd have gone for a 90s TUI-style hypertext presentation. But, like I said, nice work!
uticus
Agreed, a better option would be SSH / Telnet server in addition to a web page, perhaps with auth instructions given on the web page to keep the majority of bots out.
hombre_fatal
Make it fully navigable by clicking.
Every time you suggest commands (like "help"), let the user click them, and the UI responds as if they typed it and hit enter.
Every command that can be typed/clicked can be highlighted a green color or something.
kindawinda
don't tell him what to do
Daviey
It's wonderful, great job. It looks like you used, https://github.com/bony2023/react-terminal which is an interesting project.
The title for "Help" isn't a terminal font, it jumps out as misplaced.
Also, suggestion is to add some hidden easter egg commands. I was surprised `whoami` worked, but then I saw it in `help` and was sad.
But anyway:
abdisaDev@chillSpot:~$ whoami
visitor@linux_x86_64-Europe_London
abdisaDev@chillSpot:~$masswerk
This is a dangerous path! I once did the same and it grew to become https://masswerk.at/jsuix ;-)
(Historical note: pixels were bigger, in 2003. Feel free to zoom in / increase the text size.)
ThinkingGuy
Ironically, it doesn't work on a text-only browser. All you get in ELinks is:
Link: preload
Link: preloadalkh
Black screen in Lynx for me as well (:
o1o1o1
I really like it, well done!
As others mentioned, if you use this to attract clients or recruiters, I recommend adding a version for non-technical folks.
As a nerd I'd love to see some more colors like in the themes you can set using Prezto or Oh-My-ZSH (reference: https://github.com/sorin-ionescu/prezto?tab=readme-ov-file#t...).
For the projects I think some click function to open an ncurses-like modal would be cool :)
Another idea: what about adding a light mode?
P.S.: I would also add `rm -rf` and return something like "nice try ^_^"
noufalibrahim
Nice. One of the earliest examples of terminal style websites I've seen was jwz's www dot jwz dot org. (Linking from here produces a different site). I remember it being like this 20 years ago and it still is.
duxup
Apparently that user doesn't want people linking from this site or something.
I guess they don't like anyone who happens to click on a hyperlink here...
noufalibrahim
Wasn't aware of that. I'll edit my link
conrs
Link NSFW - props on style though.
rckt
Looks nice, but feels like it's not complete. No tab completion. The font styles are not terminal like. Looks weird with those headers. Would be also great to be able to click stuff. In my opinion this needs improvement in either way. Otherwise feels half-baked, you didn't go full terminal way at the same time did not give an easy way to navigate.
JdeBP
You are the second person, after feisuzhu, to talk of tab completion.
But we were told a TTY not a shell.
Historically, there were all sorts of user interfaces that one could get over a terminal, not just Unix, GNU, and other shells. There were BBSes of many flavours, Prestel, and any number of bespoke menu-driven systems.
Giving people a shell inside a WWW browser has been done, and is even somewhat hackneyed at this point. (https://news.ycombinator.com/item?id=39829463 got 0 votes and 0 comments.) But some other kind of terminal interface makes for an interesting change.
The phrase "You are in a maze of twisty passages, all alike." seems apposite, at this point. (-:
abaymado
Good job! Make it more mobile-friendly (only tested on iPhone). Like many others suggested, make the segments clickable for non-technical people to navigate, and add commands like cd, ls, etc., to make it more interesting for hackers. Gobez!
RayJSeth
Love seeing folks passion projects like this! Feels very old-web, not just stylistically, but also just the culture of folks making things that _they_ want to and just putting them out there.
I recently put a minor terminal-ish toy on my personal site https://rayjseth.io/ as an excuse to play with the infra to build/deploy go-wasm+Next in Vercel.
Always feel like those labor of love tangent projects are the best place to grow new skills :)
andrethegiant
If you like this, you'll also like https://root.vc
Very nice, but if you want to use it professionally you should consider having an alternative "clear text" version for recruiters and the like. The technically minded will find it nice but most people won't know what to do or what any of this means. And you could consider adding `ls`, `cd` and `exit` just for fun -- it was the first thing I've tried.