Skip to content

Building this website: Part 2

Posted on:January 2, 2021 at 08:20 PM

Since my previous post about rebuilding this site, I’ve made enough progress to actually launch the site. You’re looking at it right now :)

Stack

Initially, I planned on using Gatsby, and I in fact built the entire site with Gatsby at its heart. But where’s fun in that?

Next.js with TypeScript

While I was finishing the site with Gatsby, Next.js 10 came out, and I had to try it. It’s such an impressive framework, there was no way I won’t give it a shot. It took me a few hours to completely replace Gatsby with Next.js, and there’s so much I love about Next! Just some of them are:

Developer experience is also pretty nice. With Next’s amazing flexibility and ease of use, I was able to rewrite major chunks of code trying different approaches, and it not only was a breeze, but it also allowed me to try multiple things within just a couple of hours. All told, I’m a fan. I wish Svelte Kit gets to the same level of maturity sometime really soon — for now, Next.js is the next best thing.

Tailwind 2

I’m a huge fan of utility-first approach offered by Tailwind. It takes a minute to get a hang of it, but when you get it, you get it. It’s fantastically easy to style elements, move them around, make things as responsive or rigid as you want. It’s a truly great tool for efficient and productive web styling. While I’ve been working on the rewrite, Tailwind upgraded from version 1.x to 2.0, migration was a breeze.

Sanity

I’ve selected Sanity.io as a CMS for my website. Some of the reasons for this decision were, in no particular order:

So far, I love what I’ve built with Sanity, and I will showcase my setup in a separate post. I got so thrilled with this CMS that I’ve built a plugin for it: Autocomplete Tags. I use it in every project now :)

Cloudinary

The last technology I want to mention is Cloudinary. Honestly, it was an afterthought to the large extent, and a lot needs to be done before I can claim in earnest that I’m using it. So far, all it does is “generate” social cover images for my posts. Try sharing this post on Facebook or Twitter to see what I mean. I will write another post about this bit as soon as I get to reworking social images.

Deployment

Originally, I was planning on deploying this site to Netlify. I love Netlify, it’s a great place to host a JAM website. However, at the time I moved from Gatsby to Next.js, Netlify was not too friendly to certain aspects of Next’s powers. And given that Next.js is created by the same folks who run Vercel, I naturally just moved to Vercel. As a result, not only did I cut build and deployment time in half, I also have access to “real-time” web-vitals/lighthouse analytics — it’s built into both Vercel and Next.js.

Vercel Analytics

What’s next?

This year, I plan to make some major improvements.

Stay tuned for more. One of my goals this year is to blog much, much more. And I’m determined to stick with this goal 💪