Hello once again! I have returned from a sub 24 speedrun of converting a Firebase SSG website to one running on Vercel with the help of Sanity CMS. Why did I accomplish such a task, what is a CMS, is Firebase irrelevent? All these questions and more, will be explained right now.

What is a CMS?

A Content Management System, or CMS, or just that. A system for managing content. Think of it like a database admin ui, except, it doesn't have all the crappy features of an admin ui. CMS's are designed so that you, as the creator, have control of your information. Sanity, Wordpress, and Storyblok, are all examples of Content Management Systems. That is mostly the basics of what a CMS is, but I want to more in detail cover Sanity.

Sanity is the most customizable CMS I have seen, like, ever. And, it's free (mostly)! Sanity allows you to create something called Sanity Studio. At it's simplist, it is a fully static React app that lets you edit things called documents using a highly customizable editor. You can self host it, but they also offer a free hosted solution. Instead of the editor being premade for you, and you having to go off what rudimentary tools are premade, Sanity lets you create your own editor. Through the installation of custom made, or community plugins, you can generate special content editors for specific types of information. At the moment, I am writing this post using mdide, which is a super simple wrapper around React SimpleMDE. This basically allows me to write full markdown, all with community made tools! Isn't that cool or what.

Sanity basically lets you integrate any text, image, or file editor into a simplistic web ui. The Sanity frontend then makes these systems work with multiple users, at the same time. You can make themes, editors, custom element types, and plenty more!

Why?

The sanity part

Wasn't my old system functional, efficient, and easy to use? It was, kinda. My old system used something called Static Site Generation (SSG). This is the process of running through a bunch of server side files, and generating static files (HTML, CSS, JS). Basically, my old system had a single Markdown document for each blog post. This worked fine, and I actually really like writing text inside VSCode. It is a very simplistic editor, and feels very lightweight to me. While I liked editing in VSCode, I didn't like everything that occured because I was writing in VSCode. Like the fact that my documents are stored locally.

I actually have most of my thoughts on the go, and those are typically my inspiration for my writing. While I can open up the notes app and just write down the stuff, it isn't really the best experience. This is where Sanity comes in.

Sanity actually makes it like at least 15 times more fun to write things. Using Sanity Studio, I am currently working on this post on my computer, then when I leave, I can pick up on my phone, tablet, or literally anything else! My old systems hails in comparison to Sanity, which syncs all my documents to the cloud, in real time!

The vercel part

Also, why didn't I just keep using Firebase? Firebase worked, it was super fast, and was completely static. If I wanted to update anything, I would need to be on my home computer, and manually build and deploy the site (ok, I had command line scripts but still). Vercel is actually the creators of Next.js, so the are slightly biased towards them. Certain hosts, when in combination with certain frameworks, allow something called Incremental Static Regeneration. This is like 1 step behind full blown server side rendering, which I don't need.

Here is incremental static regeneration in a nutshell (From Next.js docs):

• Any requests to the page after the initial request and before 10 seconds are also cached and instantaneous.
• After the 10-second window, the next request will still show the cached (stale) page
• Next.js triggers a regeneration of the page in the background.
• Once the page generates successfully, Next.js will invalidate the cache and show the updated page. If the background regeneration fails, the old page would still be unaltered.

That 10 second number can be anything. Basically, it waits for a request, serves the old content and starts a timer. During that timer, everyone sees the old content. Once the timer ends, everyone new sees the new content.

I switched to Vercel for the ISR. Firebase only supports completely static sites, or cloud functions (which are not the same as ISR or SSR). It wasn't a painless switch, but it really kinda was because it just took like an hour to configure the stuff. Not bad for a vendor change.

What about firebase?

No, I didn't ditch Firebase. They are still powering literally everything happening on my site, after the initial page load. Everything before that is handled by Vercel and Sanity. Firebase Authentication, Firestore, and Analytics are still actively being used to log you in, save your comments on this post (hint hint nudge nudge), and track you...

Anyways, #notspon and goodbye!