Structuring Content with Directories

Once a blog grows past a handful of articles, keeping everything organized is harder than it looks. renoun's directory primitives let you describe how content should be loaded, validated, and sorted in one place.

Start with clear directories

Group related content into directories that mirror the reading experience you want. Posts live in posts, podcast notes might sit in podcasts, and long-form tutorials can have their own folder. Each directory can define its own schema, sort order, and loader.

const tutorials = new Directory({
Cannot find name 'Directory'. (2304)  path: 'tutorials',
  filter: '*.mdx',
  loader: {
    mdx: withSchema(
Cannot find name 'withSchema'. (2304)      {
        frontmatter: z.object({
Cannot find name 'z'. (2304)          title: z.string(),
Cannot find name 'z'. (2304)          date: z.coerce.date(),
Cannot find name 'z'. (2304)          duration: z.string(),
Cannot find name 'z'. (2304)        }),
      },
      (path) => import(`./tutorials/${path}.mdx`)
Parameter 'path' implicitly has an 'any' type. (7006)    ),
  },
})

Typed collections make it clear which metadata is available and prevent a pile of defensive checks in your UI components.

Add new content without wiring

When you drop a new file into the directory, renoun picks it up automatically. You can focus on the writing while the directory handles validation and sorting.