Tiptap Documentation
A custom-built Next.js documentation site for Tiptap with multi-product support, version management, authentication, and performant content collection system handling hundreds of MDX files.
Why we built it
The Tiptap docs needed a complete rebuild. We had multiple products to document, different versions to support, protected demos that needed authentication, and navigation that had to work across products and versions. It was complex, and nothing off-the-shelf could handle it without compromising on performance or flexibility.
I decided to build a custom Next.js app from scratch. It was the only way to get exactly what we needed.
How it works
The heart of the system is a custom content collection that processes hundreds of MDX files efficiently. Instead of loading everything at runtime, we build the entire documentation structure during the build phase. The result is a site that serves content instantly.
Each product has its own scope with separate navigation, versioning, and content hierarchy. The system understands how guides, API references, and examples relate to each other across products and versions. Everything stays maintainable because the structure is clear and the build process is fast.
We also built in authentication for protected demos and premium content. The navigation adapts based on what users have access to, so the experience feels seamless.
The hard parts
Search was the biggest challenge. With hundreds of pages across multiple products and versions, I needed search that was fast, accurate, and understood context. I built a custom solution that indexes content intelligently and returns relevant results without slowing anything down.
Content management was tricky too. With so many products, guides, and topics, I had to create conventions and tooling to keep everything organized. Without that structure, it would’ve become unmaintainable pretty quickly.
Versioning added another layer. Supporting multiple versions of Tiptap simultaneously, with content that diverges between versions, required careful handling. The system needed to show the right content for the right version without duplicating effort.
The design
Nick Hirche from Tiptap handled the design. He’s really talented and understood exactly what a documentation site needed. My job was taking his vision and making it performant and maintainable.
What stuck with me
This project taught me a lot about scaling documentation systems and managing complexity in content. It’s one of the projects I’m most proud of because it’s more than just a website. It’s infrastructure that helps the entire Tiptap community learn and build better.