indexblog

Now using Astro

• goncalomb • meta,​astro

Earlier this year I decided to rebuild this website using a modern framework… It’s now powered by Astro!

The background

Ever since I started this website back in 2013, it has always been running on some custom PHP backend. In 2018 I even rebuilt and published the “CMS” on GitHub (asbestos). This CMS only had very basic routing and some HTML utility classes, but it was always good enough to serve a couple of pages.

Then I started the blog. That required implementing proper content management with Markdown files, images, etc. this was never part of the original system. And after my last post gained considerable views from Hacker News, some people started asking for an RSS feed. I knew it was time for a rebuild. I didn’t really want to implement anything else on this old system.

The framework

My basic requirements were TypeScript, React, and static site generation.

At first I considered Next.js, but my (limited) experience with it was not very good. I never liked the way it mixes server and client code, and it always felt too dependent on Vercel. I also tried Gatsby, but it looked too fragmented with too many plugins and configurations.

Ultimately, I couldn’t be happier to have chosen Astro. With Astro basically everything that can, will be rendered as static HTML for improved performance. It also has built-in content management using content collections with TypeScript type-safety, server islands if you want server rendered content, integration with several UI frameworks (e.g. React) and much more.

The rebuild

As for the website itself, the new design very much mirrors the old one, still using Bootstrap and a custom theme, with some minor changes. I had to create a couple of remark/rehype plugins (that’s what Astro uses for Markdown and MDX, unifiedjs), to properly render my old blog posts files, but other than that, it was just a matter of recreating the design using Astro components and moving the files.

Now the blog has a proper RSS feed, year and tag pages, header links and a dash of view transitions.

I also have another site running Astro, the documentation for my Jira Cloud App, WDIScan (wdiscan.com), is built using Starlight, a documentation theme for Astro. Gone are my unmaintainable HTML pages with httpd mod_include (lol).