Building a Blog with Astro

First post, kind of using it both as a light explanation of this blog itself and as a test of markdown rendering.

When I set out to build a blog, I wanted something fast, minimal, and easy to maintain. After evaluating a handful of frameworks, I landed on Astro.

Why Astro?

Astro ships zero JavaScript by default. That means every page is static HTML until you explicitly opt into interactivity. For a blog, this is exactly what you want:

• Fast page loads
• Great SEO out of the box
• Markdown-first content workflow
• Simple deployment to any static host

Setting Up Content Collections

Astro’s content collections give you type-safe access to your Markdown frontmatter. Here’s what a basic schema looks like:

import { defineCollection, z } from "astro:content";

const blog = defineCollection({
  schema: z.object({
    title: z.string(),
    description: z.string(),
    date: z.coerce.date(),
    tags: z.array(z.string()).optional(),
    draft: z.boolean().default(false),
  }),
});

export const collections = { blog };

This gives you autocompletion and validation for every post’s frontmatter.

Writing Posts in Markdown

Posts are just .md files with YAML frontmatter. Here’s the workflow:

1. Create a new .md file in src/content/blog/
2. Add your frontmatter (title, description, date, tags)
3. Write your content
4. The build system handles the rest

Code Blocks

Astro has built-in syntax highlighting via Shiki. Here’s an example:

function greet(name) {
  return `Hello, ${name}!`;
}

console.log(greet("world"));

Lists and Formatting

What I like about this setup:

• Simplicity: Markdown files, no database
• Speed: static HTML, no client-side rendering
• Flexibility: Astro Islands for interactive bits
• Portability: works as an Obsidian vault too

What’s Next

1. Add syntax highlighting themes for light/dark mode
2. Implement related posts suggestions
3. Add an open graph image generator
4. Set up automatic deployments

---

If you’re thinking about starting a blog and want to build it yourself, give Astro a try. I’ve been happy with it so far.