This site started as a single index.html file — 976 lines of inline CSS, JavaScript, and markup all in one place. It worked, it looked great, and I had zero idea how to maintain it.
The Problem with One Big File
The original file was generated through an AI Builder program at work. It’s a genuinely good-looking terminal-themed portfolio, but the moment I wanted to add a blog or change a section I’d have to dig through nearly a thousand lines to find the right spot. Not fun.
Coming from Astro on previous projects, I knew there was a better way.
What Astro Gives You
Moving to Astro meant:
- Content Collections — blog posts are now just Markdown files in
src/content/blog/. Drop a file in, it appears on the blog. No HTML to touch. - Components — the terminal shell (title bar, CLI input, status bar) is one layout file that every page shares.
- TypeScript — the frontmatter schema is type-checked, so a typo in
date:won’t silently break anything.
The terminal aesthetic transferred cleanly. The CRT scanlines, the boot sequence, the typewriter effect — all still there. It’s the same design, just organized properly now.
Writing Posts
Each post is a Markdown file with a small frontmatter block:
---
title: "Post Title"
date: 2026-06-04
description: "One sentence summary."
tags: ["tag1", "tag2"]
---Then just write Markdown below. Astro renders it, applies the terminal prose styles, and adds it to the blog listing automatically.
What’s Next
The projects section still has placeholder modals — those need actual content. And I want to wire up the CLI blog command so it navigates here from the home page.
But the foundation is solid now. Writing here should actually be easy.