Show HN: My personal website is a shell | Hacker News Reader

Show HN: My personal website is a shell

aava.sh

425 pointsaavshr171 comments

Neat! If I can make one suggestion: I know this is usually not at all what people should with websites, but consider hijacking basic browser hotkeys to augment the shell. Tab for auto complete instead of select next element would be a good start, and I think in this type of situation its acceptable to hijack.

I agree, hijacking is good when it leads to the expected user behaviour. I kept pressing tab to auto-complete the command, but the cursor jumped to the address bar.

I kept pressing up to retrieve my last command.

There we go, I opened this thread with two things in mind that immediately struck me - tab completion and pressing up for previous command and those two are the top comments!

I am in ok with hijacking tab in general. The fact that tab doesn't act as a tab key in text areas is one of the most annoying things about the web.

Also consider auto focusing the field when the page loads

thanks for the input, yes definitely planning to do this

If you do, please check the various meta keys. Hijacking tab is expected here, but not cmd-/alt-tab etc.

nice! this is a fun project so I ma glad you are wanting to go further with it.

I immediately tripped on the autocomplete issue. Still, a super neat thing.

Also CMD+K to clear window

isn't it Ctrl+L

This if fun, few suggestions.

The first command I ran was `ls`, which worked as expected, but then I tried running `./cowsay blah`, which didn't work. I wasn't sure how to run it until eventually I guessed `sh cowsay blah`, and it worked.

Maybe make the `./` shortcut for executing stuff?

While I'm not sure how much work it would be, it might also be kind of cool to implement the `cd` command as well.

I implemented './' and it should be live now.

This "just worked" for me. Nice work

tab completion?

I kept trying `./cowsaydo-not-run-me` because `ls` outputs with no separators (`ls -l` fixed me up)

Same here, ls output needs formatting help on mobile. I was hoping glob might work too - could be a useful update

Same here on mobile (iPhone 7)

Yes, especially since cowsay was marked in a different color!

Expected behaviour from *nix would be that you'd either

  sh somescript.sh

  ./someexecutable

Of course the extension is not technically required, but it would help in the UX for the user to try running it on the sh command.

As "cat cowsay" tells me that cowsay is an executable, I wouldn't expect "sh cowsay" to work in any event.

I personally think this is the best solution besides implementing ‘./‘: take the colouring off and simply return “permission denied” when someone tries to ‘chmod’

hi thanks for the suggestion.

Yes, I plan to implement './' which is the expected behavior for running executables. I also plan to implement 'cd' and organize the content into nix style directories.

I did the exact same thing and assumed I was seeing some strange behaviour on mobile, until I came here.

Also I was wondering what 'do-not-run-me' would be so my first try was 'file do-not-run-me', but alas, that command didn't exist.

If you type "help", it says:

    sh: run an executable file

Yeah, I saw that after, but since it looks like a Unix shell, my first reaction is to just use typical Unix commands.

Once I couldn't figure out how to run it, I typed help and it showed me way to do. Seemed pretty intuitive

It seems to work now.

    ./cowsay covfefe

Never seen a thread with so little hate and so many suggestions. Made me smile! Good work OP I enjoyed playing around with your website

Hackers only hate on things that they don't think they could have written themselves.

That's what I was thinking!

So here's my suggestion: add some text adventure games. Use emscriptem to convert frotz or something similar to javascript.

same, but oh there's hate (further down)

Stupid nerds that felt mislead and needed to express disdain that 'personal website' and 'shell' isn't useable as a full shell to hax0r on. smh

I have two suggestions: 1) Add support for tab key so users don't have to type the entire file names 2) On initiation display the available commands or a brief intro text automatically, then let users dive deep into whatever they are interested in (help command works fine but it's a personal website so you would like to give people as much info as possible as fast as you can in the most original way.) It's a quite original idea.

hi thanks for the suggestions. Yeah, I also thought whether I should display the available commands at the start or not, but it makes more sense to do so.

Absolutely do this. The initial blank prompt felt intimidating without any suggestions; and would help with the esoteric aspect of it for certain user sets. :)

It’s hard to make a shell that works like a real shell. Make it a shell from a parallel universe instead, or something more like a text adventure game, or a REPL in a context specific to your home page.

A weird aavshr command prompt for probing your inner mind. ADB: aavshr debug bridge. The visitor has just interrupted execution in a novel lisp that runs in your head and can inspect current state and run a handful of functions.

Something less familiar than a shell will give you more freedom to be really weird. REPLs are all the rage and a lot more flexible. Good luck!

thanks for the input, it is indeed hard to make a shell that works a like a real one. I'll keep your words in mind.

Such a great idea! I'd personally consider using busybox in WASM instead of reimplementing a shell. Quick Google search found [1]. Have you considered that?

[1] https://tbfleming.github.io/em-shell/

hello, thank you for the pointer. Will definitely look at it.

  guest@sif~% sudo rm -rf /
  Command not found : 'sudo'. Type 'help' for available commands.

Oh well, it was worth a try :)

Great work! I would add that you should turn off auto-capitalization for tablet/mobile devices, to preserve the shell aesthetic.

  <input type="text" autocapitalize="off />

This is cool. My personal website (https://iamlocaljo.com/) is visually a terminal, though it doesn't support ls, cat, etc and only has commands for page names. Maybe I should add support for ls, cat and other typical shell commands. Good idea.

You two should add an Easter egg where you can “ssh” into each other’s sites ;)

website shell ring!

[NEXT] [PREVIOUS] [RANDOM]

I even almost called it shellring haha

heh, would be too fun. the gofer gang is still around if you're all in for text.

My personal site is definitely not a shell, but it occurred to me I could add shell-like functionality as a console easter egg and get in on the fun.

The min and maximize buttons seem to work but the close doesn't. Is that a bug?

The close button takes you home from any other page.

this look super nice! Great colors and much more informative than my website!

Add tab support, how can you make me type out full commands?! :)

will do, I plan to implement all the expected unix shell features, thanks for the suggestion!

Please also add "arrow up" to repeat the last command :)

hello, thanks for the input. Yeah, implementing history is next in line :D

the site is so 'shell' like, this actually confused me that it didn't work. that's a compliment on how i had already bought into this being a shell.

I tried to go for a shell aesthetic, but it is nowhere near as interesting as yours: https://chrissardegna.com/

That one is really nice because it’s an actual website with information that you get without having to put much effort in.

Thanks! Sometimes I worry that the text animation is too slow, but I think its a good balance currently.

looks neat! Do you have the code open sourced?

I'm sure JS devs will hate it, but yes: https://github.com/ReagentX/ReagentX.github.io/blob/master/j...

tl;dr: it appends text from a file to a div, pausing on a specific delimiter.

I only use Github pages for a development testbed, my "deploy" is an FTP copy to my personal web server.

I've enjoyed working on similar projects, they are fun.

A small usability suggestion, since your whole page is a shell and the input field isn't well visually defined, I would make clicking nearly anywhere give focus to the input field.

Hi, thanks for the suggestion. Yeah, this definitely is very annoying when the input isn't focused when you click elsewhere.

A neat side-effect (unintended?) is when I hit ^d to exit the shell (almost by reflex), the bookmark add got triggered on Chrome

Yeah, the website is very early and I just implemented basic commands. I plan to implement keyboard shortcuts, history, and all other fun shell stuff.

I’d say keep that one. It’s a fun little bit of meta

There isn't one to keep, its just keyboard shortcut in chrome(??)

He means, don't override it to give it its normal shell meaning, as the current meaning (add bookmark) is pretty desirable for him as owner of the site.

`sh do-not-run-me` reminds me of this excellent talk: https://www.destroyallsoftware.com/talks/a-whole-new-world

  guest@sif ~ % vi about.txt
  Command not found : 'vi'. Type 'help' for available commands.

Very cool site. Looks great! It felt so much like a console that I tried to tab for auto-complete! (^_^)b

Thank you. Yes, I just implemented this over the last two weekends and is very early. I plan to implement all the other fun *nix shell features.

JS/UIX [1] originated from the same idea. Compare command "info". Supports vi and (space) invaders. But no globbing. :-)

[1] JS/UIX (2003) https://www.masswerk.at/jsuix/

Nice job! If you want to see a (very hacky) example of autocomplete, history, and inline-image support check out a shell I wrote recently: https://zenith.tech

Code: https://github.com/zenithdb/zenith.tech

thanks!

Very cool! Add some “directory” as sections to your website, so people would “cd” into them to see the various sections (with probably index.html as a default MOTD?). There is also a mini bug when one lists the directory with “-l”: the filenames come right next to permissions. Just add a space in between. Great job!

On Safari, I'm getting all the files mashed together.

If you want some inspiration, have a look at https://replit.com/site/careers. I believe they're running a docker container, which gives you the full bash experience!

I tried `curl` and `wget` before finding the `help` command. Kinda bummed out that tab completion doesn't work. And neither does `ls -la`. Also make it so I can click anywhere to get my cursor back on the right line for typing.

Cool idea, though I kept experiencing something akin to the uncanny valley, where it was "close enough" to a shell that it really bothered me that it didn't work as expected :)

Eg I immediately tried to use tab-completion (as have many others) only to land in the URL field. Then I tried to use "less" to read the file, only to have that not work. Finally had to look up the help.

I guess the UX lesson here is if you're going to emulate a really familiar interface, you have to do it fully or otherwise people's muscle memory is going to lead them astray.

Don't get me wrong, cool technical idea.

It's really hard to use I would say. No completion, no history. You need to click directly over the input. It's nice exercise to create Terminal from scratch, but I don't understand why people don't use jQuery Terminal. Maybe they are afraid that it have jQuery in the name.

Here is advanced example that use real like commands with Pipe operator (from Bash). With figlet, lolcat and cowsay commands that can be mixed: https://codepen.io/jcubic/pen/vYLvvXx

You can glue pretty advanced website just collecting examples from https://terminal.jcubic.pl/examples.php

With jQuery terminal you only need to care about the commands. Note that the library is more like a framework.

This reminds me the HTML5 terminal component, which didn't get much attention. I've used it for some API works and is indeed useful / cool

I've done a similar thing few years ago. You can check it out at the bottom of the website at http://138.68.65.145/ (website is old and needs updating, same with the domain). I decided to print the output to the alert popup. I have `clear` and `exit` implemented, and going up/down the command history.

And... I got rickrolled. Well played.

Interesting bit of Javascript. Fun.

In the code that handles the long form of ls, I'd suggest ensuring spaces between "file perms" and "file names": Safari gloms them together.

Not sure why "sh" is needed to "run" things, since items are encoded as objects: Why not for...in and if not found "command not found"?

thanks for the suggestions. Yeah, I used 'sh' just for now as a basic command, I plan to implement all the expected nix shell features.

Reminds me of https://bellard.org/jslinux/vm.html?cpu=riscv64&url=buildroo...

I'd wager you could actually put a real linux shell in your website with that!

That code ended up turning into term.js which forked into xterm.js (which I maintain). It's quite a mature project at this point https://github.com/xtermjs/xterm.js, you can combine it with https://www.npmjs.com/package/xterm-local-echo to make implementing something like this website much easier.

Awesome, did you get a chance to check out the out-of-the-box-thinkers at https://replit.com/site/careers? The original application of the idea aS A full-fledged hiring shell.

Browser is the new cool!

Don Hopkins did something quite like this a long time ago: http://www.art.net/~hopkins/Don/unix-haters/login.html

That's pretty cool. I'm working on a text adventure and I end up creating a "shell" as well. One thing I did that I liked very much is auto complete and history. I think it would aggregate a lot to your website as well. Great job!

This is a library that can help you to implement similar experience on your own website:https://github.com/tautvilas/termpage

as suggested by many hn users in this thread, I've implemented './' to execute files and it's live now.

This can probably go in this list of these websites which look like win 98 mostly https://simone.computer/#/webdesktops

I love the idea, but there are a few UX issues which area rather annoying. One such issue is that the <input /> loses focus rather easily, like with as hitting the TAB key. The other thing which I find suboptimal is that the input does not get focus when I click on the "terminal". If I use the shell, I expect to be able to type whenever the pane receives focus.

Another non-technical thing is that as a non-tech user I would be lost, since there's no indication of what to do on the page, a little hint in form of a MOTD would be a nice touch to round it up.

thanks for the suggestions! Yes, the input not focusing is very annoying and other people have also pointed it out in this thread. Will definitely fix that. Also agree about the second point, will probably display help first on load.

and also: good job! :) (just to round up the critique :D)

Hey love your site man, I was actually surprised when I found out about your work. Your company is building amazing product and I remember being interviewed as a user by your company.

Loved the product that you are working on

thank you, yeah we are really excited about our product at work, Deta also gifted me this domain which led me to create this website.

Idea: implement history to log and show what the other users tried to do with the shell. It would also probably be a great way to get new feature ideas.

Nice and fun. I would use it as website to give to recruiters. I would have saved a lot of time this way.

Love this idea. I’ve used a shell-like Hugo theme for my personal website, which at least preserves readability when JS is disabled. At this point, I wonder if you shouldn’t just plug a real shell to the website instead of faking one.

Neat! Though I would recommend making clicking anywhere on the screen focus the text input.

I don't understand why this has reached HN frontpage, sorry. There are thousand of weird, demoscene, experimental sites and this one in particular is dull. Dull, dull, dull, dull, dull (as a monty python's reference)

Pretty cool. Maybe on suggestion, disable autocorrect and autocapitalize

Adding to the feedback, click on the whole thing should just focus the current input, I mean, that's general behaviour.

Amazing website though, liked the idea

I love these, put one together for my own site with some hidden features like a theme switcher. One suggestion I'd make on yours is focusing when clicking anywhere on the screen.

I've been waiting for Linux terminal emulators to have inline images, video and particularly GUI for certain programs. I've been thinking of writing this for years now.

I tried combining the available commands to come up with something cool but it didn't work. It might be interesting to support pipes:

    cat about.txt | cowsay

that's a nice surprise. long ago i implemented my website as a text adventure with parchment.js - it's a bit more usable for non terminal users

I was just about ready to move my entire workflow over to this, but I couldn't get the cd command to work. Thanks for wasting an hour of my life.

Very cool! Mine is a very similar thing written in TypeScript: https://j1.io/

Only command that didn't work for me and wasn't listed here is cmd-k to clear the screen. Maybe most people don't use that, though.

cowsay and do-not-run-me are up against each together in the ls when I check in safari, i.e. it's not obvious that they're separate commands.

ah thanks for the info, I need to fix it for safari and mobile!

On iOS, if you press return without any input, the shell loses the cursor and there is no way to get the keyboard back without reloading the page.

Your personal website is a blank page with JS disabled.

It's as if you're looking for reasons to shit on OP. Come on.

For most websites; there's no reason for JS. For something like this? That's just being a prick about JS for being a prick about JS's sake.

I was also rather disappointed that when curling this "shell", nothing happens. Or rather, you just get the minified javascript just like it would give to your browser and using a shell to access this would-be-shell does absolutely nothing. And no tab complete, up arrow, and I see elsewhere in the thread that even ./ didn't use to work. It seems the author has very limited experience with shells and made an -- I would say 'elaborate' but it wasn't -- rick rolling page.

Come on, you cannot infer that the author has "very limited experience with shells" from an incomplete (early!) implementation. Read the rest of the thread anyway, you'll understand that you are mistaken very fast.

I agree that a fallback website when JS is disabled (with complete relevant content) would be good (progressive enhancement), with a hint that one may want to try enabling Javascript for fun.

... now can you make it work the same over telnet? :D

Getting rickrolled in a terminal. Future is today.

Why isn't there sound on the Rick Astley song? "I just wanna tell you how I'm feeling. Gotta make you understand."

Command not found : './do-not-run-me'. Type 'help' for available commands.

auto-complete doesn't work also (<tab>)

hello yes sorry, './' and auto-completion don't work as of yet. The website is still early, I plan to implement most of the expected unix shell features soon.

Your site looks nice, but these 2 would drastically increase usability for me

The website is not mobile-friendly (as of yet)

  est@sif
  ~
  %
  elp
  mmand not found : 'elp'. Type
  elp' for available commands.
  est@sif
  ~
  %

this is fun, i agree with the suggestions to make it function more like a real terminal. tab completion is a must

Awesome site man! Would love to know the color scheme you are using. Would definetly use it in my terminal :D

man, i can see this being really useful.

you need to expand on this... I'd buy a series of .sh domains just to use this.

fun! and seeing all the other random shell-inspired personal sites popping up in here made me smile

I've been surreptitiously rick-rolled by myself ... funny but kind of evil at the same time ;-)

This reminds me of that XKCD from a few years ago: https://uni.xkcd.com/

Many keyboard shortcuts I rely on in a shell is hijacked by browser. So sad

Neat (if not that original) idea and side project, but I hope you know that not too many people will take the plunge to extract info out of something like this. About sites should be about easy showcases. This approach would be better for an online utility/tool.

why not emulate a real shell (ie, a virtual machine) and implement the tty in a web browser?

isolate the system calls with some sort of sandboxed technology so you can provide a real unix experience.

hi thanks for the suggestion. I thought about this but decided against it as: 1. It's slower, I want to emulate the speed of running a shell in your local machine 2. I don't need all the nix shell features since it's a personal website. I can add features that only seem necessary for what I want to tell others about myself.

Rm not implemented loool

Not including whoami and whoareyou are missed opportunities.

Great! However, one issue.

If you click anyway, you can no longer type.

You are evil!!! I've just rick-rolled myself :D

pretty cool, makes me want to register one for myself

thanks, you could do it. The code is open sourced (https://github.com/aavshr/aava.sh).

./cowsay `cat about.txt` didnt really work

Nice name, cool project. Keep it up Aavash!

needs a funny response to rm -rf /

just one file inthere?? :/

really like the shell ergonomics, how about adding tab completion?

Useless on mobile

so how did you build this

You should support emacs.

please hijack tab

love it!

love it

Not really a shell, click baited. Sad.

This is the single most awful web experience I had in my life.

I'd look at the comment above as complement, now you know what not to do (:

This wasn't helpful, how might OP improve the effort?

No command history, no tab completion. One assumes that "shell" is aspirational rather than descriptive. It's an interesting idea, but if you present what appears to be a shell interface to users expecting a shell interface, they're going to wander away pretty quickly after discovering it's merely facade. I wish you luck, but this isn't really ready for visitors yet.

It is totally ready for visitors. I visited, I enjoyed it. Doesn’t seem particularly wise to advise people something isn’t ready for people to visit, when those visitors are the only ones who can actually give useful feedback.

One hopes that the author didn't need me, a stranger, to tell them that this site is missing most of the fundamental features of a shell. Feedback is valuable, but strangers aren't going to visit something that clearly doesn't work a second time to see if they're making progress. There is a reason that early testing and feedback on prototypes is limited to in-house or pre-existing customer review. The author is entitled, and even encouraged, to ignore me--but my feedback is that they should have waited until they were closer to their goal and general feedback would be more valuable than hundreds of copies of "it doesn't work".

> but my feedback is that they should have waited until they were closer to their goal and general feedback would be more valuable than hundreds of copies of "it doesn't work".

This is the exact opposite of useful feedback. I hope you realise project that is literally intended for fun...

What definition of "shell" are you basing this on? Some (current) Unix systems I use have default shells that have neither command history nor tab completion.

Easy access to command history and tab completion are certainly niceties that came along at some point, but are in no way part of the definition of a shell.

ok, I'll bite. What current Unix systems ship with a default shell that supports neither command-completion nor command-history?

The one I have to use frequently is the restricted ksh environment in IBM's IVM/VIOS server, which is AIX.

I believe it does log a short set of command history to a file, but it'd not available with, say, the up arrow.

In general, though, I don't think any form of history is required by the POSIX shell standard, and tab-completion definitely isn't.

ksh93 supports both completion and history. I lost interest in looking before uncovering information about versions of ksh more than thirty years old, but neither feature is mentioned in descriptions of differences between ksh93 and predecessors, so I suspect the feature has been there for longer. Posix compliance is neither necessary nor sufficient for a reasonable colloquial definition of "shell."

hi thanks for the input, yes it is very early and I just posted this mainly for validation; I wanted to know if only I thought this was cool or if others also saw it as something fun. I did not anticipate so many people using this. I plan to implement most of the expected shell features soon.

Cool. It's probably not an original idea, but it's good one. I might even steal it from you at some point. Good luck with the project.

This is a personal website more for showing off than for being useful.

That the quality of someone's work doesn't matter because they don't care about it or expect it to be useful isn't a particularly compelling argument.

I think you’re being overly critical of someone’s hobby project. This isn’t an enterprise app. It’s a fun little thing they made and wanted to share with us. If this is how the community reacts to what is really barely a hobby project it doesn’t surprise me at all that devs are burnt out from supporting OSS projects that probably have 1000s of ppl like you that complain and expect the world for free.

I thought it was pretty cool, and glad they shared it.

Reply on news.ycombinator.com