I rewrote my site. Why?
- Published on
- Updated on
Updated on
I rewrote my site. Why? To put it simply and honestly:
- I was a little tired of the near-minimalism. This wasn't enough for a full rewrite, but
- I'm not using Golang a lot, but I am using more Next.js and React for projects.
My static site was built with Hugo with Tailwind for styling. Now my site is based off of the Tailwind Nextjs Starter Blog, but modified heavily to my liking. Ironically, the author of this template was inspired by one of the more complex and complete Hugo templates and kept the Hugo frontmatter, which totally worked in my favor as I shifted articles over.
What did I keep?
- Most of my posts
- Tailwind
- Surprisingly, Vue for a couple of posts and p5 for a few others
- Semi-hidden tags
Using S3 to host images
What did I throw out?
- Hugo and its templating engine, Golang, and fully static pages
- Minimalism
- Career timeline. This was just a duplicate effort from LinkedIn.
- Building any new tools in Vue
- Dark-mode (for now)
- Probably the minimal footprint. I was proud of the <100kb size (minus the art) of the first site.
- Static html file hosting through S3
- Stability. Hugo has been rock solidly stable for the last few years with few if any breaking changes.
- Hosting image on S3
What's new?
- Neobrutalism(-ish). Colors! Fun!
- Next.js
- React with Typescript
- kbar search (cmd + k or use the search in the navbar)
- Search through articles on the main page
- MDX
- Dynamic routes, eg being able to create an api or complex app on this site
- Hosting on Vercel
- Image hosting using Cloudflare r2 and webp
- Comments via giscus
Notes
- I was able to embed
- Vue apps on SRE
and Linear Clock - WASM-compiled Golang on Learning Golang, with a demo
- p5.js on Ripples and P5.js Demo
- but these don't always load correctly. Refresh while on the page. I'll have to fix that soon.
- Vue apps on SRE
- Adding a search to my site was on my todo list for a long time, and it's here now!
- MDX wasn't on my radar, but I'm loving the ability to add components in otherwise plain markdown files. I was getting a similar but worse capability with partials in Hugo.
- I originally chose Hugo for its relative simplicity and speed and that I could get familiar with Golang to a degree. I've been using so much more Ruby, Elixir, React, and Python lately. Spending time with Golang isn't bringing me joy, so I'm trying something different.
What do I expect out of this?
This switch addresses some of the limitations I was feeling with my static site. I wanted to build a few more tools, but needed some sort of backend and more dynamic frontend. I expect I'll be better able to build these things in a stack that I'm using frequently.
I want to have more fun with my personal site.
Revisiting after 6 months
Quick breakdown of my thoughts after running this iteration of my blog for (a bit more than) 6 months:
- MDX is surprisingly nice. I really like being able to embed React components into pages like on Roman Days, Roman Days by Linear, and SRE Calculator Revisit.
- I can't seem to get the migrated Vue pages to work consistently. It's likely a rendering vs external resource loading timing issue that I just haven't figured out. I've converted a couple of them over to React instead.
- Nextjs isn't quite as stable as I had hoped. They're changing some fundamentals like caching defaults (justifiably so) and static vs dynamic rendering. Some of the included components, looking at you <Image>, are almost impossible to use out of the box nicely --
height
andwidth
are required with remote images but can't take percentage andsizes
is so complicated to figure out due to screen density and interactions with height and width. - The Tailwind Nextjs Starter Blog template is fantastic to get all of these features wrapped together and configurable. I do not like the pliny library, however. I can't seem to wrap my head around how to enhance or even reimplement it in my repo with how it's supposed to be working today. To me it feels like an unnecessary package -- a wrapper of wrappers with little configuration especially on styles.
- Colors and fun were worth it. I've been playing with everything, but I may tone it down a little soon.
- WebP images really are small and fast. They really are a pain to download and use.
- I miss the fully static pages from Hugo to some degree. I could have built everything in React components on pages if I had wanted to. I don't miss the templating and shortcodes oddities though.