diff --git a/commands/now-template b/commands/now-template index 6d3a2e5..564d691 100644 --- a/commands/now-template +++ b/commands/now-template @@ -18,7 +18,9 @@ publishedOn = publishedOn === '' ? publishDate : publishedOn

Published on - + {publishState}

diff --git a/public/ayo-run.png b/public/ayo-run.png new file mode 100644 index 0000000..d1130e5 Binary files /dev/null and b/public/ayo-run.png differ diff --git a/src/constants/bkup/2025-03-23.json b/src/constants/bkup/2025-03-23.json new file mode 100644 index 0000000..07053d0 --- /dev/null +++ b/src/constants/bkup/2025-03-23.json @@ -0,0 +1,7 @@ +{ + "title": "Building a tiny web ecosystem", + "description": "I am focused at bringing my own web ecosystem to life", + "publishDate": "2025-03-23", + "publishedOn": "the 23rd of March, 2025 in my home in Amsterdam", + "publishState": "where it is starting to get sunny again (sometimes)" +} diff --git a/src/constants/bkup/2025-03-23.md b/src/constants/bkup/2025-03-23.md new file mode 100644 index 0000000..7cb9659 --- /dev/null +++ b/src/constants/bkup/2025-03-23.md @@ -0,0 +1,10 @@ +I have been building my own tiny web development ecosystem. + +My web "terrarium" -- at least, that's how I think of it. + +I _now_ have: + +1. [McFly](https://mcfly.js.org) - a metaframework for web components. I describe it that way because the web development industry is still largely in a "component" paradigm. I am hoping to support a different paradigm though, which I _still_ cannot put into words at the moment. So let's keep to thinking "web components" for now. +2. [WCB](https://webcomponent.io) - a low-level reactivity system for... yeah, web components. There's a trade off between productivity & lightweight-ness here and it is somewhere between [Microsoft's FASTElement](https://github.com/microsoft/fast) & [Google's LitElement](https://github.com/lit/lit/). Though the other "knob" to balance the trade off, is building it generic so that devs can also use custom stuff, like now you can [use lit-html with it](https://codepen.io/ayoayco-the-styleful/pen/ZEwNJBR?editors=1010). + +Many things missing still, as is with all "terrariums", but building a model that represents the larger world allows me to understand web development in ways I never imagined I can. diff --git a/src/constants/now.json b/src/constants/now.json index 07053d0..c31ef8a 100644 --- a/src/constants/now.json +++ b/src/constants/now.json @@ -1,7 +1,7 @@ { - "title": "Building a tiny web ecosystem", - "description": "I am focused at bringing my own web ecosystem to life", - "publishDate": "2025-03-23", - "publishedOn": "the 23rd of March, 2025 in my home in Amsterdam", - "publishState": "where it is starting to get sunny again (sometimes)" + "title": "Running self-hosted services at www.ayo.run", + "description": "Put up a home to self-hosted open source alternatives to popular services", + "publishDate": "2025-05-24", + "publishedOn": "the 24th of May, 2025 in my home in Amsterdam", + "publishState": "while it is drizzling and gloomy outside" } diff --git a/src/constants/now.md b/src/constants/now.md index 7cb9659..e9196af 100644 --- a/src/constants/now.md +++ b/src/constants/now.md @@ -1,10 +1,13 @@ -I have been building my own tiny web development ecosystem. +As a weekend project, I have set up my old "gaming" laptop as an Ubuntu server to run services under my fancy new domain [ayo.run](https://ayo.run) (could be blocked by enterprise firewalls). -My web "terrarium" -- at least, that's how I think of it. +[![ayo.run screenshot](/ayo-run.png)](https://ayo.run) -I _now_ have: +The computer is sitting inside the water meter cabinet at home, and I route it through [Cloudflare Tunnel](https://developers.cloudflare.com/cloudflare-one/connections/connect-networks/) which gives me the protection while exposing it to the Internet without a public IP address. It's like magic. -1. [McFly](https://mcfly.js.org) - a metaframework for web components. I describe it that way because the web development industry is still largely in a "component" paradigm. I am hoping to support a different paradigm though, which I _still_ cannot put into words at the moment. So let's keep to thinking "web components" for now. -2. [WCB](https://webcomponent.io) - a low-level reactivity system for... yeah, web components. There's a trade off between productivity & lightweight-ness here and it is somewhere between [Microsoft's FASTElement](https://github.com/microsoft/fast) & [Google's LitElement](https://github.com/lit/lit/). Though the other "knob" to balance the trade off, is building it generic so that devs can also use custom stuff, like now you can [use lit-html with it](https://codepen.io/ayoayco-the-styleful/pen/ZEwNJBR?editors=1010). +Very happy with this because it is way more powerful than the VPS (Virtual Private Server) I am renting for [ayco.io](https://ayco.io) stuff, but I am practically paying zero aside from the usual the electricity, internet bills. -Many things missing still, as is with all "terrariums", but building a model that represents the larger world allows me to understand web development in ways I never imagined I can. +I am posting updates about the project on this [thread](https://ayo.ayco.io/threads/114490408596372783). + +By hosting more polished web applications created by active open source communities, I learn different approaches on how people build stuff and am now able to consider them for my own projects. 🎉 + +I have plans to make [cozy.pub](https://cozy.pub) easily self-hostable when I get to building more features for it. diff --git a/src/layouts/common.css b/src/layouts/common.css index 9aed3ef..cb47023 100644 --- a/src/layouts/common.css +++ b/src/layouts/common.css @@ -2,3 +2,12 @@ padding: 1em; border-radius: 1em; } + +img { + border: 1px solid var(--color-border); + border-radius: 5px; + box-shadow: 5px 25px 10px -25px rgba(34, 34, 34, 0.15); + max-width: 100%; + object-fit: contain; + height: auto; +} diff --git a/src/pages/now/and-then/posts/2025-03-23.astro b/src/pages/now/and-then/posts/2025-03-23.astro new file mode 100644 index 0000000..7df8fca --- /dev/null +++ b/src/pages/now/and-then/posts/2025-03-23.astro @@ -0,0 +1,72 @@ +--- +import Layout from '../../../../layouts/Layout.astro' +import Footer from '../../../../components/Footer.astro' + +const title = `Building a tiny web ecosystem` +const description = `I am focused at bringing my own web ecosystem to life` +let publishedOn = `the 23rd of March, 2025 in my home in Amsterdam` +const publishDate = `2025-03-23` +const publishState = `where it is starting to get sunny again (sometimes)` +const content = `

I have been building my own tiny web development ecosystem.

+

My web "terrarium" -- at least, that's how I think of it.

+

I now have:

+
    +
  1. McFly - a metaframework for web components. I describe it that way because the web development industry is still largely in a "component" paradigm. I am hoping to support a different paradigm though, which I still cannot put into words at the moment. So let's keep to thinking "web components" for now.
    2. +
  2. WCB - a low-level reactivity system for... yeah, web components. There's a trade off between productivity & lightweight-ness here and it is somewhere between Microsoft's FASTElement & Google's LitElement. Though the other "knob" to balance the trade off, is building it generic so that devs can also use custom stuff, like now you can use lit-html with it.
    3. +
+

Many things missing still, as is with all "terrariums", but building a model that represents the larger world allows me to understand web development in ways I never imagined I can.

` + +publishedOn = publishedOn === '' ? publishDate : publishedOn +--- + + +
+

{title}

+

+ + Published on + + {publishState} + +

+ + + +
+ + +