Welcome to the first post on this site. It’s primarily for me to throw ideas and stuff out. It’s kind of like putting all the long conversations I have with myself into something with 11 9s of durability.
Shame, Shame, Shame
So yes, this site was made with AI. This is an ugly admission. I have mixed feelings about AI. On one hand, it’s an amazing tool for doing so many things and I’d be lying if I said I don’t use it regularly. In fact, I don’t think it’s unreasonable anymore to say that it is actually a competitive advantage to use it.
On the other hand, it makes me deeply sad and concerned that my field is changing at a rate that nobody can keep up with. I feel like my intrinsic human value is diminished. My ability to meaningfully contribute to the field is gone. Everything is slop. Everything is fast and cheap.
The only comfort is that the future is uncertain for everyone because of AI.
While it’s tempting to become a cyberterrorist focusing on the ultimate and total destruction of AI and its constituents, I think it’s a better idea to instead pivot into roles where AI is undesirable — like security, or accelerating to higher, more important roles. AI can’t be held accountable.
Anyway, enough doom and gloom. Life is good. Let’s talk about the site. One thing to note is the content of this site will not be AI. It’s my words, my thoughts. At best, AI will be relegated to a spell checker and Markdown formatter because I couldn’t be arsed.
How was this site built?
The front-end was cooked up by Sonnet and is a statically rendered set of HTML, JavaScript, and MDX. Some tool called Astro is involved. No idea really.
What I do know about is the “backend”. It’s kind of a stock-standard S3 static site with some bits.
Essentially, I deploy the statically generated files in a GitHub Actions pipeline to dump them into S3. It’s configured with Origin Access Control (OAC) to CloudFront which serves the files. One nuance I’ve been tripped on for many prior attempts was page routing. Inherently, CloudFront will receive a URL and that maps to a particular index.html file within S3. This is fine if your site has only one page, but that’s a bit shit for a site for which you want to have a variety of content or features.
There are a few solutions:
-
Client-side rendering — In the past I’ve used some form of client-side rendering. If I recall, I’ve used React with some bits and bobs attached which essentially navigate pages within the same document. So basically the JavaScript within the page handles the rendering of the “page” content you want. It’s clunky but I got it to work. (Pre-AI too!)
-
Hardcoded CloudFront behaviours — The next option was something cooked up by my friend. Somehow he sort of hardcoded the “routes” of each page within S3 in a CloudFront behaviour. Worked well but it was a bit of a pain to manage all the behaviours.
-
CloudFront Function — The last option, which is what I did, was to jam a small CloudFront Function into the distribution I created. It’s a very simple and cheap function which intercepts viewer requests. Say,
matthewlategan.co.za/apage— it will intercept that, and appendindex.htmlto it, which then maps the requested URL to an actual HTML file. One caveat is if you ask for a page that doesn’t exist, it will throw an access denied instead of a 404. But that’s minor. The solution works pretty well and the URLs look good.
Here is the code:
function handler(event) {
var request = event.request;
var uri = request.uri;
if (!uri.includes('.', uri.lastIndexOf('/'))) {
request.uri = uri.replace(/\/?$/, '/index.html');
}
return request;
}
There is not anything interesting to say about the rest of the site. It’s a Route 53 record which points to the CloudFront distribution. I bought the domain on GoDaddy and then decided GoDaddy is gross, so I transferred it to my personal AWS account. And ACM (AWS Certificate Manager) handles the certificates to allow HTTPS.
Anyway, that’s a fine first entry.