Building this blog with MDX + Shiki

This page is written in plain MDX. You can mix prose, links, tables, and code blocks in one file.

Why MDX here?

• Keeps content close to React components
• Easy to add custom UI blocks later
• Works well with static imports and route-level rendering

Syntax highlight sample

import { createFileRoute } from "@tanstack/react-router";
import { motion } from "motion/react";
 
export const Route = createFileRoute("/blog")({
  component: BlogPage,
});
 
function BlogPage() {
  return <motion.main initial={{ opacity: 0 }} animate={{ opacity: 1 }} />;
}

Markdown table

Add more posts by creating new files in src/features/blog/content.