Refactor to multi-page SPA with React Router and blog system

.gitignore

@@ -1 +1,2 @@
 node_modules/
+dist/

content/blog/building-with-threejs.md

@@ -0,0 +1,28 @@
+---
+title: "What I Learned Building an Interactive 3D Scene with Three.js"
+date: "2026-03-20"
+tags: ["three.js", "javascript", "creative-coding"]
+excerpt: "A look behind the scenes at how I built the interactive cube animation on my portfolio site, and what I'd do differently today."
+---
+
+If you've visited my site before, you might have noticed the colorful interactive cubes floating around the background. That scene was one of my favorite side projects — a chance to combine web development with creative coding.
+
+## The setup
+
+The scene uses Three.js with about 1000 cubes on desktop (250 on mobile). Each cube responds to mouse hover with an elastic scale and rotation animation powered by TWEEN.js.
+
+## Lessons learned
+
+**Performance matters on mobile.** My first version tried to render the same number of cubes everywhere. The frame rate on older phones was terrible. Reducing the cube count for mobile and simplifying the animations made a huge difference.
+
+**Keep the interaction loop tight.** Raycasting on every mouse move can get expensive. I learned to throttle the raycaster and batch state updates instead of reacting to every pixel of movement.
+
+**Color palettes set the mood.** Adding theme-cycling with arrow keys and brand-color switching on social icon hover turned a static scene into something playful. Small interactions make a big difference.
+
+## What I'd do differently
+
+If I were starting over, I'd consider using React Three Fiber instead of vanilla Three.js. The declarative approach fits better with a React codebase and makes cleanup much simpler.
+
+But honestly? Sometimes the "just make it work" approach teaches you more than any framework.
+
+You can still play with the cubes — check out the [interactive scene](/cubes).

content/blog/hello-world.md

@@ -0,0 +1,27 @@
+---
+title: "Hello World: Welcome to My Blog"
+date: "2026-03-25"
+tags: ["personal", "web"]
+excerpt: "After years of building websites for others, I'm finally taking the time to write about the things I've learned along the way."
+---
+
+After years of building websites for others, I'm finally taking the time to write about the things I've learned along the way.
+
+## Why start a blog?
+
+I've always believed in the power of sharing knowledge. Whether it's a tricky CSS layout, an interesting React pattern, or just thoughts on the industry — writing helps me solidify my understanding and hopefully helps someone else too.
+
+## What to expect
+
+I'll be writing about:
+
+- **Web development** — React, JavaScript, CSS, and the tools I use daily
+- **Career reflections** — lessons from my journey as a software engineer
+- **Side projects** — things I'm building and experimenting with
+- **Quotes & inspiration** — because I'm still a quote lover at heart
+
+## Let's go
+
+This blog is built right into my personal site using Vite and React. Posts are written in Markdown, which keeps things simple and focused on the writing.
+
+Thanks for reading, and stay tuned for more.

content/blog/on-lifelong-learning.md

@@ -0,0 +1,26 @@
+---
+title: "On Lifelong Learning"
+date: "2026-03-15"
+tags: ["personal", "learning", "career"]
+excerpt: "The tech industry moves fast. Here's how I think about staying curious without burning out."
+---
+
+The tech industry moves fast. New frameworks, new paradigms, new best practices — it can feel like you're always behind. But I've come to see lifelong learning not as a race, but as a practice.
+
+## Learning is not the same as keeping up
+
+There's a difference between chasing every new tool and genuinely deepening your understanding. I've found more value in going deep on fundamentals — how browsers render pages, how JavaScript engines work, how to write accessible HTML — than in jumping on every new library.
+
+## What works for me
+
+**Reading source code.** Some of my best learning moments came from reading the source of libraries I use daily. You see real-world patterns, trade-offs, and clever solutions.
+
+**Teaching others.** Whether it's a code review, a blog post, or a conversation with a junior engineer — explaining something forces you to truly understand it.
+
+**Building side projects.** Not to ship a product, but to explore an idea. My portfolio site has been a playground for trying new things in a low-stakes environment.
+
+## The quote that keeps me going
+
+> "Wisdom is knowing what to do next, skill is knowing how to do it, and virtue is doing it." — David Starr Jordan
+
+That's been on my quotes page for years, and it still resonates. Learning what to do is only the first step. The real growth comes from doing it.