随想

Building a Mathematics Notebook with Astro

Technical notes on constructing a static site for mathematical writing, with KaTeX rendering and content collections.

Why Astro?

Astro is a content-first web framework. It ships zero JavaScript by default, which suits a site whose primary content is static prose and mathematical formulae.

The key features for our purposes:

  • Content Collections provide type-safe frontmatter schemas via Zod.
  • MDX support allows embedding interactive components (e.g. collapsible proofs) inside Markdown.
  • Remark/Rehype plugins integrate KaTeX for server-side LaTeX rendering — no client-side JavaScript required.

Content Collections

The content schema enforces structure at build time:

const blog = defineCollection({
  schema: z.object({
    title: z.string(),
    type: z.enum(["core", "marginalia"]),
    series: z.string().optional(),
    pubDate: z.coerce.date(),
  }),
});

Each article declares its type (core lecture note or marginalia) and, for core notes, a series identifier such as RA (Real Analysis) or LA (Linear Algebra).

Mathematics rendering

With remark-math and rehype-katex, inline maths like and display equations

are rendered at build time into static HTML and CSS. No JavaScript is loaded in the browser for formula display.