From a3c7b94a9f377b397d9fb47e72c4eab1ff87fddd Mon Sep 17 00:00:00 2001 From: Gabriel Simmer Date: Sat, 6 May 2023 17:24:48 +0100 Subject: [PATCH] Publish well-known-fursona --- content/posts/well-known-fursona.org | 19 +++++++++++++++++++ static/images/silly-site.png | Bin 0 -> 11790 bytes 2 files changed, 19 insertions(+) create mode 100644 content/posts/well-known-fursona.org create mode 100644 static/images/silly-site.png diff --git a/content/posts/well-known-fursona.org b/content/posts/well-known-fursona.org new file mode 100644 index 0000000..7345893 --- /dev/null +++ b/content/posts/well-known-fursona.org @@ -0,0 +1,19 @@ +#+title: Well Known Fursona +#+date: 2023-05-05 + +Fursonas are a wonderful thing. They are a way of expressing one's inner self in a relatively safe manner, whether it be as a dark grey wolf or a vibrant pink and red cross between a dragon and a hyena. It's a fantastic escape from reality and frankly I think more should embrace the concept. I've adopted one as an extension of myself, giving me a character I can use consistently. As time goes on I've been trying to figure out my own self-identity and having a fursona does help. The opportunities to meet interesting people who share this interest also cannot be understated, and there's a significant number of people in the tech industry who are furries. It's fantastic. + +Getting to know someone's fursona can be tricky, though. Some may have at most a reference sheet illustrating important markings or features of a character, others may have an entire novel series of their character's backstory. As a lover of standards, these wildly different approaches are both a blessing and a curse, so I was very interested when I saw some talk about [[https://github.com/theHedgehog0/fursona-schema][Pyrox's fursona-schema]] repository. I feel that the =/.well-known= path is underutilised at the moment, and I found the idea of putting my fursona information in there amusing. The question was, /how to host it?/ + +Typically when it comes to static websites, there are a plethora of options, which can lead to a bit of analysis paralysis. Some of the options for static websites include GitHub Pages, Vercel, Netlify, Cloudflare Pages, AWS S3 or Amplify, 'dumb' shared hosts, and more. In this instance, I decided to opt for an AWS S3 bucket with Cloudfront as a CDN/cache to keep costs down (Cloudfront includes 1TB of egress for free). The main advantage is that due to Amazon's dominance S3 has more or less become the standard API for interacting with object stores, so there are plenty of tools and libraries available should I want to expand on it. The disadvantage being I miss out on the fancy auto deployments and integrations that other providers offer, but given this is /just/ hosting some static files (including a static [[https://gmem.ca/.well-known/webfinger][webfinger]]) I'm not particularly worried about it. + +#+attr_html: :alt A simple HTML page using dog onamonapias for words +[[/images/silly-site.png]] + +/As a sidenote, thanks to the webfinger file, I now have a custom OIDC provider setup for my [[https://tailscale.com][tailnet]]! I'll probably talk about this in another post./ + +With my first in-person furry convention coming up, I thought it would be neat to expand on the idea, making a landing page for my fursona. Others could visit and learn more without needing to read some JSON. So I got to work, gathering my current frontend framework of choice SvelteKit (for better or worse) and Tailwind for styling (I may as well give it a fair shake). It's also worth noting that I'm still very much in my "research" phase of using ChatGPT and Copilot as pair programmers (in a sense) so those tools are included but generally didn't impact my approach to things. You can find the finished product at [[https://fursona.gmem.ca/][fursona.gmem.ca]]. + +Generally speaking the application itself is very simple - a landing page prompting a domain entry, and a basic card based page for displaying fursonas from a domain. Initially, I made a =fetch()= request directly from the frontend to the resource, but ran into issues with CORS. Not wanting to add some requirement to allowing people to use it, I wrote a small amount of TypeScript code that acts as a very simple proxy. I opted to build and deploy this on Vercel, since they own SvelteKit, I have experience deploying SvelteKit sites to them, and I can use the Vercel Edge Functions for the proxy function. With that said, I have had some minor annoyances with Vercel's performance. I'm hoping to dig into why at some point, but the site works for now. I'm mostly familiar with SvelteKit, but Tailwind was new to me. While I'm not in love with it, having a pre-built CSS framework allowed me to build quickly, and the CSS files are relatively small. Cramming all the CSS into the =class= of an element can get out of hand very quickly, though, so I'm not entirely sold on it. All that said, the site packs down to 55.17kB (29.21kB transferred) for the landing page and about 63.3kB (33.7kB) for the card page itself (I say about because I had to manually calculate the value - so I might be slightly off). This doesn't take into account caching, and most assets are cached. Of course a site without SvelteKit and/or Tailwind might pack down smaller, and could be build with server side rendering for an even smaller footprint if we wanted. But the focus of this excersize, for lack of better term, was around Edge Functions and their speed, and Tailwind. + +Overall, I'm happy with the result, and it will serve its purpose at FWA. I plan to attach at least one NFC sticker to the back of my custom badge that links to [[https://fursona.gmem.ca/gmem.ca][my own page]]. I hope that some others also find it helpful, and that it encourages adoption of the well-known schema. If you do find me at FWA, I'd be more than happy to program a sticker for your page as well! diff --git a/static/images/silly-site.png b/static/images/silly-site.png new file mode 100644 index 0000000000000000000000000000000000000000..57ca415dc534a2466daf4b9a4362e0a45a94eecf GIT binary patch literal 11790 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