Mainly because of boredom and because I like to code.
Also, a website is a fantastic way to show someone what you are capable of in programming skills.
Now I have my own space to try things out, present what I did and link all my socials.
== How did I do this?
=== Frameworks
This website is entirely built-in https://nextjs.org/[Next.js], which is a JavaScript framework.
So the entire backend is in https://nodejs.org/[Node.js].
The project files are written in https://projects.eclipse.org/projects/asciidoc.asciidoc-lang[AsciiDoc].
Hosting the webserver is done in a https://www.docker.com/[Docker] container on my personal server.
=== The Process
==== Thinking About a Website
I always wanted my own website. One day, I thought about how excellent a website is, basically a console. +
It seems not too hard to make, as it consists of an input field and a log/history.
But I wanted more. I wanted the code to be as modular as possible, so it's easy in the future to add commands, project logs, and components. Also, I wanted some appealing features like tab completion and shortcuts.
==== Implementing all the Stuff
As you can imagine, it was not easy to implement all the features I had imagined. But I'm pretty confident I'm on the right track now. +
The commands are all contained in one file, and one can easily add or remove them, add flags and other attributes and change the function called when the command is requested. +
The project files are contained in a separate repository and folder on my server, which is just used as a Docker volume. This means they can be updated without rebuilding the entire project.
==== Autodeployment
I like automatization, so I use a CI/CD pipeline.
I use https://www.drone.io/[Drone] for this job which is self-hosted too.
The Docker container is pushed and pulled in a self-hosted registry, so it should be safe if I ever want to include secrets and private data into the project.
The project files are not auto deployed but only built with https://asciidoctor.org/[Asciidoctor] to check their validity.
== The Future
What future features do I want to implement? +
I don't know.
It will probably be like the rest of this website:
One day I have a good thought (At least I _think_ it's good...) and add an issue or implement it immediately.
Probably I should start by adding a https://json-schema.org/[JSON schema] for the project list.
== Shortcuts
I talked about shortcuts before, but here's a list of which shortcuts are possible:
[cols="1,4"]
|===
|Key |Effect
|kbd:[Tab]
|Inserts the current suggestions from autocompletion.
|kbd:[▲] / kbd:[▼]
|Scroll through last commands.
|kbd:[Strg+L]
|Clears the history. +
Similar to `clear`.
|kbd:[Strg+D]
|Exits the page. Don't work in (most?) cases because of a https://developer.mozilla.org/en-US/docs/Web/API/Window/close[JavaScript restriction]. +
