Ask Claude to Scaffold an Astro Site from Your Content Structure

Astro ships zero JavaScript by default — perfect for content-heavy sites. But wiring up content collections, layouts, and dynamic routes still takes time. Let Claude do the scaffolding.

Scaffold an Astro 4 blog site. I want a content collection for blog posts with frontmatter: title, date, tags, and description. Generate an index page that lists posts sorted by date, a [slug].astro dynamic route for individual posts, and a tag filtering page.

Claude generates a complete project structure with typed content collections, a Zod config schema, and the correct getStaticPaths calls for fully static output:

// src/content/config.ts
const blog = defineCollection({
  type: 'content',
  schema: z.object({
    title: z.string(),
    date: z.coerce.date(),
    tags: z.array(z.string()),
    description: z.string(),
  }),
});

export const collections = { blog };

From there, extend the site without fighting Astro's internals:

Add an RSS feed at /rss.xml, an auto-generated sitemap, and syntax highlighting for code blocks using Shiki with the github-dark theme.

You can also ask Claude to add an @astrojs/image integration for optimised images, a view transitions API for animated page changes, or React/Svelte islands for any interactive components.

Get a fast, typed content site running before you write a single word of copy.