Why rebuild
It has been nearly a year since my last post. I got a job and life got busy. I had built some projects while I was unemployed and have been building even more over the past year. I've wanted to post about it, but I felt my old WordPress blog and authoring flow held me back. I write in Markdown, I think in code, and I edit in VS Code.
I did a survey of what open source blogs are out there and quickly settled on TailwindBlog. Next.js is the foundation—it has all the benefits of modern React and TypeScript, with server side rendering for performance and SEO. It's easy to customize the UI with Tailwind CSS and extend the blog's structure and functionality with TypeScript.
How I worked
Before I started building the website I focused on content strategy. I wanted to ground this project in some concrete goals. I didn't ask AI to invent a strategy; I gave it the ingredients in my prompt:
- a purpose: show off things I've built, or what I'm up to
- a channel: LinkedIn—I want to ensure content posted to my professional network is engaging
- an inventory: a detailed list of six projects I've been working on
- constraints: a hobby blog, 1–2 posts a month, keep it fun, no budget for an artist
- a role: "an expert versed in personal blogging and personal brand"
- a mode: "let's discuss", a conversation rather than a deliverable
I engaged in a back and forth discussion with Claude and drafted a plan for a series of posts to create and publish over the next several weeks. I crafted a positioning statement and tagline for the site: "Engineering leader. Still ships." I figured out how to ensure that any content cross-posted to social media would look great—having a good hero image and preview text.
Brand
I knew I needed a logo for the website and I didn't want to hire an artist (or use slop). The classic 3D Nintendo 64 logo popped in my head. I quickly whipped up a simple program to model a 3D "NH" in the style of the N64 logo, then projected it into a 2D SVG and rendered with the Night Owl VS Code palette. These are the colors I look at every day in VS Code and it felt like a good fit. I also used the palette for the rest of the design elements on the website.
I'm pretty happy with what I came up with, and the code is on GitHub if you want to borrow it to build your own logo.
Content pillars
One thing that came out of my research was the idea of having a few content pillars for the blog. The main themes of my writing are building things, leadership, and fun, and so my pillars were born.
Social cards
One of my goals for a professional personal blog is good social media support, particularly on LinkedIn, where I cross-post my content about building and leadership. I made sure every post gets a rich preview card (an "OG card") when it's shared.
Cleaning up the artwork
The previous version of this blog used a mix of AI-generated art and real photos. Some of the art looked pretty sloppy, so I removed it. I kept the "Cartoon Nick" hero images because I like them. That cartoon version of me is fun, and I'll try to use him again in the future.
Generating hero images was one of the things slowing me down, so now any post without one gets an auto-generated "terminal card" instead. I like having some kind of featured image rather than nothing at all, and generating one automatically is right up my alley.
Reader experience
The default TailwindBlog has a few layout quirks I didn't like. The home page shows 5 posts, with an "All posts" link at the bottom. Clicking it takes you to a different view of the blog that shows… the exact same 5 posts, with a "Next" link at the bottom. So getting from post 5 to post 6 takes a click, a scroll, and another click.
I updated the home page to show a short list of older posts at the bottom, followed by an "All posts" link to a page that shows 20 posts at a time instead of 5. The template hard-codes that 5 in several places, so I pulled it into a single setting, which made the change pretty easy.
What's next
I'm pretty pleased with how the new blog turned out. I'll be able to replicate it for my wife's site and our family website. I'm looking forward to hacking on it with my kids!
Stay tuned for posts about my other projects and what's going on with me right now. I'm particularly excited to share the "email to draft a post" feature I built, post-inbox.