Built With

Back in the day (2008), johnzanussi.com was the home of my Tumblr blog.

Screen shot of johnzanussi.com from 2008

Then, in 2014, I switched it to a single splash page with “Full site coming soon” in the footer. Ah, yes, the famous soon™.

Screen shot of johnzanussi.com from 2021

Almost eight years later, in late-2021, I finally built a more elaborate website for myself. Since then, the site has continued to evolve. Below you’ll find some of the libraries and services I used and why I chose them.

You can also find all the code for this site available on my GitHub.

Libraries

Astro

As of February 2023, this website is built on Astro. While browsing Reddit one day, I saw someone mention Astro. I immediately fell in love with it as it takes static site generation to the next level. I wrote a detailed post about why I chose Astro and the migration from Next.js which you can read here.

Next.js

Next.js has quickly become my go-to for spinning up project sites. It’s easy to use, has many starter projects, and deploys easily. The Next.js code has been preserved in the nextjs branch on my GitHub.

React

Your only option for Next.js is React, which is fine since it’s what I’m most comfortable with. I’ve been writing React regularly since 2016.

Bootstrap

For this project and another personal project, I gave Tailwind a chance. Tailwind is great if you’re working in an established design system with a custom component library and need utility classes. Bootstrap shines compared to Tailwind in the vast array of out-of-the-box components.

Font Awesome

Font Awesome gets an honorable mention here, as I used a handful of their icons throughout my site.

A complete list of packages can be found in package.json

Services

Vercel

I didn’t know much about Vercel until I was ready to deploy my first Next.js project. Out of everything here, I’m most impressed with Vercel. I’ve never experienced a more seamless out-of-the-box solution for deploying static websites. Best of all, it’s free for personal projects.

FastComments

I spent quite some time looking for the best way to add comments, including rolling my own, to this site but eventually landed on FastComments. The key aspects that won me over are that it’s pretty feature-rich, doesn’t require commenters to create accounts, offers a React library, and collects as little data as possible. While FastComments is not free, my site does such little traffic and comment volume that it only costs me $0.99 a month.

Plausible

I’m self-hosting Plausible at analytics.johnzanussi.com to collect traffic data from this site. I followed this amazing guide to get the self-hosted instance installed and running on DigitalOcean.

Grammarly

Since I’m not the best at articulating my thoughts into words, I started using Grammarly’s Premium plan to check my work. It’s most useful for me as a spell and grammar check, but I also appreciate some of the other suggestions, helping to make my words more readable.