Show HN: XHTML – Expert HTML

Hello everyone, I wanted to share with you one of my crazy ideas that I have been working on for the last couple of months.

The platform is a collectible card platform, like Pokemon TCG, where you use your cards to build a website. Each day you get a new pack, with HTML tags, attributes, CSS elements, etc. and you have to make the most of those to compete against other devs. The idea is to figure out how to do more with less and to learn from others.

As for some background on this... I have many crazy ideas, my brain can't stop sometimes. Using AI to write code for me has scratched some of the itches that my brain has farted through the years and have been living rent free in there for way too many years. Now they can land into the world (and maybe they shouldn't?) and I can free some mental space for new crazy ideas.

I have develop my career in security (cybersecurity, couldn't hurt a fly even if I tried) and one common thing I saw when dealing with a free text field is that users could insert some HTML tags, but only from a shortlist. Things like <b> or <i> but never <script> or <video>. Well, my brain thought: "what if they add 1000000000e56 <b>s? Don't we want to limit that too?" and that thought has been in my head for too long.

That is why, to test some of the AI coding capabilities, I created the html-allowlist npm package[0] early this year. Once I had that done my brain was happy and I was happy. A library that does what I always thought it was the best way of filtering content: you can add some flourish to your comment/textfield but not _too much_. Not sure if anyone will ever use it, but now they can.

Then another thought came in: what is that make us scratch that pleasure of achieving more with less? With AI you have all that stream of code pouring without any effort but there was some pleasure on the struggles to get things to work when resources where limited or finding creative ways to do things on our own.

As a bit of a gamer myself, quickly thought on the Pokemon TCG mobile app, where you get daily packs, build your deck and you battle. And because I have now the library that prevents more than N tags/elements to be present in an HTML page, I could apply that here and build something similar.

So I did, I have been trying to apply all my learning from years of working as a security engineer in different companies to try and build a website that allows people to have a simple personal website but also showcase their web kung-fu skills. I was very happy when I saw a few days ago here about CSS Zen Garden[1] because this website was an early career inspiration for me, as well as being a type of scenario where I could see this platform going: small web mastercrafted by hand.

I know people will come and say "if you didn't code it yourself why should we bother with it?" and you are more than welcome to do so. But for me this is about finally getting that idea out into the world, which maybe doesn't need a website like this, but maybe there's some joy on opening a random pack, slowly improving ones webpage, learning about an obscure CSS trick and appreciating others' skills.

Anyway, I hope you give this a go, it is my first attempt to release something that feels, hopefully, like a final product, so happy to hear what you all have to say and see what you get to build.

Pedro Laguna - https://pedro.laguna.es/

[0] https://www.npmjs.com/package/html-allowlist [1] https://news.ycombinator.com/item?id=49713262