Sometimes I have the itch to create something that’s not (just) useful, but pleases the eyes.

I’ve started experimenting with webgl a few years ago, mostly in shadertoy - but most of my experiments aren’t public.

This (fullscreen) is one of my favourites. But of course I’m still not entirely satisfied with it.

A quine is a computer program which takes no input and produces a copy of its own source code as its only output.

This one is not really a quine, but something similar, 1020 bytes of HTML/JS that animates it’s own code. Inspired by the great work of @aemkei.

Click here, to see it in action!

CSS Paint Worklet (Houdini) experiment to generate cellular noise based mesh.

Details on github.

WebAuthn uses public key cryptography (asymmetric) instead of passwords or SMS texts for registration, authentication and 2FA.

• Protection against phishing: webauthn signatures changes with the origin, so it won’t work on “similar” webpages (with different domain name).
• Reduced impact of data breaches: it does not really matter if the public key is stolen.
• Invulnerable to password attacks: much harder to crack it by “brute force” than passwords.

How form data can get from the browser to the backend.

Without JS

• action: where to send the data (URL, current URL by default)
• method: GET, POST (and there’s dialog too…)
• enctype: only for POST, Content-Type of the data
  • application/x-www-form-urlencoded - default, URL encoded body
  • multipart/form-data - multipart data, required for file uploads
  • text/plain - for debugging, don’t use, security issues

Why?

• DoS - Denial of Service attacks
• Brute Force attacks
  • collect customer email addresses (signup)
  • reveal username/password pairs (login)
  • send emails (contact us, gift card)

CSRF is an attack that forces an end user to execute unwanted actions on a web application in which they’re currently authenticated.

Data (from untrusted source) gets into the application, then this data is later displayed in the website without being properly validated/sanitized/escaped.

Modern browsers apply the same-origin policy to some resources, meaning they refuse to load or restrict access to resources coming from other origins than the loaded website. Servers can implement CORS to describe which origins are permitted to load their resources.

For some HTTP requests, browsers issue a “preflight” request (HTTP OPTIONS) to check whether the resource is available for the given origin.

Backend

• app to the server
  • scp
  • git
  • maven/npm/pip/whatever
• start it
  • prefer using a “webapp container” like tomcat or gunicorn
  • on a “high” port like 5000, 8000, 8080
• make it start on reboot
  • systemd
  • supervisord/pm2
  • …