Migrating from BaseHub to Content Collections

We recently migrated our content management system from BaseHub to Content Collections, a powerful solution for generating type-safe data collections from MDX files. This migration provides better developer experience, improved type safety, and more control over our content structure.

Why Content Collections?

Content Collections offers several advantages over our previous setup:

• Type Safety: Full TypeScript support with automatically generated types
• Local-First: All content lives in your repository, no external dependencies
• Flexible: Complete control over content structure and transformations
• Fast: Build-time generation means zero runtime overhead
• MDX Support: Native MDX compilation with plugin support

Migration Process

The migration involved several key steps:

1. Dependency Updates

We replaced BaseHub dependencies with Content Collections packages:

2. Collection Configuration

We defined our collections using Zod schemas for type safety:

3. Component Updates

We updated our components to work with the new MDX content structure, including:

• Body Component: Now uses MDXContent from Content Collections
• Table of Contents: Integrated with Fumadocs for TOC generation
• Image Component: Simplified to use Next.js Image directly
• Code Blocks: Custom implementation for syntax highlighting

4. API Simplification

The new API is much simpler and more intuitive:

Benefits Realized

Since completing the migration, we've experienced:

• Faster Builds: Content is processed at build time, not runtime
• Better DX: Full autocomplete and type checking for all content
• Easier Content Management: Content lives alongside code in the repo
• More Flexibility: Easy to add custom transformations and processing

Next Steps

With Content Collections in place, we can now:

• Add more content types easily
• Implement custom MDX plugins
• Generate reading time automatically
• Add image optimization and placeholders
• Create more sophisticated content transformations

Conclusion

The migration to Content Collections has been a significant improvement to our content management workflow. The type safety, local-first approach, and flexibility make it an excellent choice for modern Next.js applications.

If you're considering a similar migration, we highly recommend Content Collections for its developer experience and powerful features.