This blog runs on Next.js
So... I've been wanting to start a tech blog for a while now. Like years. And now that I finally bit the bullet, I was faced with the obvious question: what's my first post going to be about? After some debate, I decided to *briefly write about the tech stack I built the blog on.
I'm using Next.js, a framework based on React. I know, why do we need a framework on top of another framework. Isn't that overkill? Well, one really nice thing I love about Next.js is its support for Static Site Generation (SSG).
Static sites are great because they're lightweight, very well cacheable, and typically fairly small and compressed in size. All the niceties and verbosity of the development environment have been stripped away by the time the site is generated. To host this site, I'm using AWS Amplify which has built-in support for Next.js projects.
One thing I was adamant about was making the writing process as simple as possible while still preserving flexibility when needed. For that, I'm using MDX, which is Markdown but with support for embedded React components. It's pretty baller. And to top things off, I added a plugin to support Frontmatter, which is a YAML based header that can define key-value metadata pairs at the top of the file.
The start of this blog literally looks like this:
---
title: This blog runs on Next.js
author: Jacob Chappell
date: '2023-05-08'
excerpt: I finally started a tech blog, and I built it using Next.js.
---
Now that's some inception.
Getting the whole YAML Frontmatter thing to work was a bit tricky. I went down several wrong paths in the process and tried a few plugins that almost did what I wanted but not quite. I wanted to be able to write my blog posts without any boilerplate code in each, and I still wanted to be able to access the metadata for layout and templating purposes.
In the end, I landed on the plugin next-mdx-remote which accomplished my needs well. I was able to store my posts in a separate directory and scan them with Node.js code during the server-side SSG process in order to build references for my Home and Posts pages.
Well, that's all for now. I hope to see you again in future posts. 👋
Published May 8, 2023 by Jacob Chappell
