Astro Web Rewrite

Welcome to my website! I am very excited to have you here. Thank you for taking the time to read through!

This project writeup is an overview of the site design, the decisions I made, and the workflow of maintaining and making posts on this site.

Why rewrite at all?

Previously, the website was using NextJS compiled to static files. This was great, as I could write in JSX, a language I am very familiar with, and it provided me basically infinite flexibility to create whatever I wanted.

While good, even that setup had some limitations.

Goals

The overarching goal was to basically replicate the functionality of most CMSes, like Ghost, Medium, WordPress, Substack, etc. without needing to adhere to prescriptive patterns. I wanted flexibility of the platform while also being super easy to use. Those are very hard things to overlap on a venn-diagram.

It is worth noting why I did not even mention templating engines like handlebars, mustache, Pug, etc. These are way too static and slow and they are very strict in their formatting. This is just a no-go out the gate for all the years I wanted to try to use them.

Primarily, given NextJS, the entire movement of React and Vercel pushing into these very perscriptive models of server deployments and software development was leaving a sour taste in my mouth. I just did not feel right continuining with that framework, even though React has been my main go-to for all web stuff for a decade.

I prefer to self-host or have plenty of control over the hosting solution. When you use most serverless platforms, it’s easy to get into a slippery slope of a development model where you are always scaling and paying more money. This may not matter for a site like this, but I just wanted to avoid that entirely. NextJS was technically doing that, but who knows if they will make a change in the future where, for example, they no longer support static builds for some reason?

Secondly, I still needed to write code. Even though it is pretty simple, having to manually do formatting between lines was very frustrating. I loved the infinite flexibility of writing my own custom components for my blog, but it always felt like more development rather than actually using the site.

This is where Astro helps a lot it seems.

Why Astro?

I of course can not exclude the fact that I used Claude to help nail down what I wanted to use. I had Claude analyze the existing project, assess my needs, and make a recommendation based on that.

I chose Astro from the recommendations, because very simply: It feels like React/Next except it is static-first. The entire point of Astro is to deploy static pages, and using MDX means there is significant flexibility between just writing out words and having infinite customization. It is even combined with TailwindCSS, my favorite CSS library!

I kinda knew that I could have done this with Next, but then it means I would have to create these systems from scratch. With Astro, this problem was already solved.

Vite, .astro, MDX, Tailwind, all outputting to static HTML. Something about that just feels right.

Given that context, I went forward with using Astro.

What the site is

This site is meant to act as a general summary into my thoughts and experiences, as well as the primary entry point for getting to know me as a person.

It both acts as a portfolio and blog, which is why there are Projects (like this) and Posts. Posts and Projects can be very similar, though Projects are meant to often be an overview of a specific project, while Posts are more specific to experiences or thoughts, whether they be about projects or not. Projects can reference posts, especially to help go into more detail, but it is not required.

The function

I’ve been meaning to really formalize my online existence into some centralized place. This is it.

We all have social media accounts hosted by any other company. But what if I hosted my own site with my own rules? I could make the content whatever I want and I could make it any format I want?

I can hyper-fixate on the smallest of things and metrics do not matter. It can act as a journal and history book of my existence. Owned, managed, and run by me. No longer am I at the will of whatever the latest corporate monopolies want me to do. I can be free.

The styling and features could be a reflection of who I am and what I care about. I can curate the user experience exactly how I want. It can be my own little corner of the internet.

I have always been fascinated by the old internet. I was only a child when it was all happening and I was born shortly post-internet, but I was there. It felt so freeing. Every webpage was unique. The chance of getting malware was SO high (sorry family PC). I also have a vivid memory of watching the NORAD Santa tracker on the carpet on a CRT on Christmas Eve. I want that back. That’s one of many reasons I made this site.

The broader impact

I guess I should be transparent about why this exists in the first place.

I’ve realized that I haven’t done a good job of formalizing who even am as a person. I have lived a very long time appealing to whatever the people around me thought because it was what I learned how to do as a child.

This is a place for me to center myself above all. I want to have a place I can go back to and remember, “This is who I am.”

Beyond that, I think it is helpful to open myself up and share myself with the world. Some of the best people I know do this in some form. A lot of them are well-established online. We know about these people because of how they present themselves through the online content they create.

Also of course, the hope is that like-minded people can come across these projects and posts and get some value out of it. Of course, I mean jobs kinda. But either way: I’ve been focuing on growing my own, actual social networks and making sure I take care of those relationships. So far, it’s been helping so much in my life, and this is just another step in that direction.

A few interesting technical bits

I have to of course mention the funny 3D badge. :)

The Badge

I had my profile picture on the top right of the landing page, and I thought to myself, “What if it was a badge?”

I had this idea of like a 90s retro but futuristic card. Think of Evangelion, like these.

(I still have to finish this post but I wanted to at least get some of it up now :P)

What’s still to come

Closing thoughts