Content Collections

Transform your content into type-safe data collections and say goodbye to manual data fetching and parsing. Simply import your content and get started. With built-in validation, you can ensure the accuracy of your data. Plus, you can preprocess your data before it enters your app.

Getting Started

Beautiful DX

Content Collections is all about delivering a delightful developer experience. It offers a smooth developer journey, eliminating the hassle of server restarts or browser refreshes. Any changes you make to your content are automatically reflected in the collections, keeping everything up to date effortlessly.

---
title: "Beautiful DX"
description: "A beautiful developer experience"
author: "Sebastian Sdorra"
published: true
---

HMR for content is

Beautiful DX

HMR for content is

Simple TypeSafe API

No more need for the tedious task of manual content fetching and parsing! Just import your content and start utilizing the capabilities of Content Collections. It provides a straightforward and developer-friendly API, allowing you to concentrate on app development. And the best part? It guarantees complete type safety.

Content Collections smartly infers the types of your collections from your configuration. Enjoy the convenience of enhanced code suggestions and have the assurance of using the correct properties. With the inferred types, refactoring becomes effortless, making your development experience smooth and seamless.

import { allPosts } from "content-collections";

export function Posts() {
  return (
    <ul>
      {allPosts.map((post) => (
        <li key={post.slug}>
          <p>{post.title
summary
description
slug}</p>
        </li>
      ))}
    </ul>
  );
}

const samples = defineCollection({
  name: "samples",
  directory: "src/samples",
  include: "**/*.md",
  schema: (z) => ({
    name: z.string().min(1).max(120),
    description: z.string().optional(),
  }),
});

Powerful Validation

Content Collections takes care of validating your content based on your defined schema. Any document that doesn't match the schema will not be added to your collection. The schema is powered by Zod, which means you can leverage all the robust validation features of Zod to ensure the integrity of your content.

During development, Content Collections will provide warnings for invalid content, allowing you to address them in your development environment. However, it won't fail the build, giving you the flexibility to fix the content as you go.

When it comes to the build process, Content Collections takes stricter measures. It will fail the build if any invalid content is present. This guarantees that your production build will be free from any invalid content, maintaining the integrity of your application.

Transformation

Content Collection does not handle the transformation or compilation of content for you. We understand that there are numerous options and use cases, so we leave that flexibility in your hands. However, we offer a robust transformation API that empowers you to customize and shape your content according to your specific requirements. With this powerful API, you have the freedom to transform your content in any way you desire.

import { defineCollection, defineConfig } from "@content-collections/core";

const posts = defineCollection({
  name: "posts",
  directory: "content",
  include: "*.md",
  schema: (z) => ({
    title: z.string(),
    date: z.string(),
  }),
  transform: (data) => {
    const slug = data._meta.path;
    return {
      ...data,
      slug
    };
  },
});

export default defineConfig({
  collections: [posts],
});

These are just a few examples of what is possible with the transform function. For more examples, take a look at our documentation.

Support

Content Collection offers a variety of adapters that seamlessly integrate with popular web frameworks. This ensures a smooth integration process, allowing you to easily incorporate Content Collection into your application. If we don't have an adapter available for your specific framework, don't worry. You can utilize our CLI tool to integrate Content Collection into your framework of choice.