Content Collections
Guidelines for using Astro Content Collections
astro
## Guidelines for Astro Content Collections
1. Purpose: Use Content Collections to organize, query, and type-check sets of related content (e.g., blog posts, projects, products) that share a similar data structure. Collections provide type safety and dedicated APIs.
2. Location: Store collection content files (Markdown, MDX, JSON, YAML, etc.) in the `src/content/` directory, organized into subdirectories named after each collection (e.g., `src/content/blog/`, `src/content/projects/`). Do NOT place collection content directly in `src/pages/`.
3. Configuration (`src/content/config.ts`):
- Define each collection using `defineCollection` imported from `astro:content`.
- Specify a `type` (`'content'` for Markdown/MDX or `'data'` for JSON/YAML).
- Define a `schema` using Zod (`z` imported from `astro:content`) to validate the frontmatter or data structure of each entry and provide TypeScript types.
- Use `reference()` within schemas to link entries between different collections (e.g., linking an author entry to a blog post).
4. Querying Content:
- Use `getCollection('collectionName', filterCallback?)` to fetch multiple entries. The filter callback receives `{ id, slug, body, collection, data }`.
- Use `getEntry('collectionName', 'entryId')` or `getEntryBySlug('collectionName', 'entrySlug')` to fetch a single entry.
- To fetch referenced entries (defined using `reference()` in the schema), use `getEntry()` or `getEntries()` on the reference object(s) returned in the `data` property of the initial entry.
5. Rendering Content:
- For Markdown/MDX entries (`type: 'content'`), import `render` from `astro:content`.
- Call `const { Content } = await render(entry);` to get a component that renders the entry's main content.
- Render the component in your template: `<Content />`.
6. Generating Routes/Pages:
- Collections do not automatically create pages. You must create dynamic routes in `src/pages/` to display collection entries.
- Static Sites (Default): Use `getStaticPaths` within a dynamic route file (e.g., `src/pages/blog/[...slug].astro`). Call `getCollection` inside `getStaticPaths`, map the results to return `{ params: { slug: entry.slug }, props: { entry } }`. Use `Astro.props.entry` in the page template.
- SSR: Inside the dynamic route file, retrieve the `slug` or `id` from `Astro.params`. Use `getEntryBySlug` or `getEntry` to fetch the specific entry needed for the request. Redirect to 404 if the entry isn't found.
7. When to Use: Ideal for multiple pieces of content sharing a structure, requiring validation, type safety, and benefiting from Astro's content APIs. Suitable for scaling to large amounts of content.
8. When NOT to Use:
- Single, unique pages (use standard `.astro` pages in `src/pages/`).
- Static assets like PDFs or images not processed by Astro (use the `public/` directory).
- Data requiring real-time updates (collections are typically processed at build time).
- When a specific SDK for a data source is preferred and doesn't integrate with the Content Layer API.
Reference: [Astro Content Collections Docs](mdc:https:/docs.astro.build/en/guides/content-collections)