Streamline Your Next.js Projects with a Decisive Headless Framework
Editor’s Note: We celebrate skilled developers who convert extensive experience into tools that empower others to create effectively. Excitingly, Edo’s launch showcases the transformative journey behind his creation.
The initial phase of any new content management system (CMS) project typically follows a predictable routine. Establish the frontend framework, connect the Studio, devise a page builder, implement SEO structures, and patch up the same contact form for the umpteenth time. By the time I actually start on the work I was hired for, I've usually burned through days of budget without delivering anything tangible to the client.
Initially, I accepted this as an inherent cost of working with a headless setup. The early days always felt like they were spent wading through background processes. However, the realization hit harder when I noticed the repetition of the same issues across different projects. It wasn't mere coincidence — persistent bugs such as data loss during a Sanity migration or a content delivery network (CDN) serving outdated images started to pile up. Each project seemed to resurrect these problems that I had ostensibly solved in previous builds, problems I had left behind in forgotten repositories.
This prompted a shift in my approach. Instead of letting fixes vanish into a one-off client project, I started consolidating them into a reusable boilerplate. That boilerplate has evolved into The Content Architecture, a foundational setup based on Next.js and Sanity that I now deploy for every new client.
This article elaborates on the rationale behind this initiative and how, after refining the framework over the years, I decided to share it with other developers.
Addressing the Overlooked Tasks
The hidden costs associated with a headless CMS project are often overlooked. Clients typically invest in visible elements like homepages, feature cases, and animations, but the labor-intensive tasks that ensure those elements function seamlessly go unquantified. Tasks such as building a stable page editor, ensuring accurate draft and live previews, and resolving caching issues are rarely perceived or justified by clients, yet they consume significant time.
The solution to these behind-the-scenes challenges is grounded not in a laundry list of features but in establishing consistent decisions throughout the project lifecycle. This foundation enables developers to bypass repeated discussions on previously settled matters, ultimately improving efficiency significantly.
A Solid Framework Trumps Feature Overload
When constructing headless frameworks, relying on varied tools can lead to disjointed architecture. On any given project, fundamental elements might not only differ from one build to the next but might also inadvertently create a patchwork of assorted opinions and approaches to the same foundational tasks.
Consider the fetch layer — often responsible for stale content delivery. A well-defined structure allows for precise control via a single helper function. I've designed this so that freshness and performance are not sacrificed, ensuring less confusion across different deployments.
Lasting architectural decisions are embedded in the foundational setup, allowing developers who build on top of it to work in harmony with the prescribed structure rather than inventing numerous new solutions. This significantly minimizes discrepancies that often arise from individual developer preferences.
Eliminating Redundant Solutions
Every aspect of the kit was born from challenges I encountered in real client work. Here are some issues that previously consumed excessive amounts of time:
Streamlined Field Handling: A versatile link field manages various types of references, from internal URLs to external links, all consolidated into one structure. Ensuring that editors don't face unnecessary complications has been a priority.
Addressing Stale Content: Enhanced fetching strategies prevent stale content from ever becoming an issue. I've included functionalities to keep drafts and previews working harmoniously.
Improving the Editor Experience: The Studio interface is organized logically, aligning with user expectations. Editors can easily locate their documents without confusion.
Integrating SEO from the Start: Rather than tacking SEO considerations onto projects at the last minute, metadata features are built into the framework from the outset, ensuring consistency and optimization.
Enhanced Compatibility with AI Tools: The structure accommodates AI functionality thoughtfully, allowing for smoother content interactions.
This toolkit alleviates the burden of routine setups: simple authentication for staging environments, spam protection for forms, CORS management, and automated provisioning are all embedded, facilitating a straightforward first run with minimal documentation required.
The Power of a Singular Vision
The architecture maintains its integrity because one individual has overseen every iteration from the schema design through to the deployment of the last revalidation hook. This singular direction avoids conflicting adjustments based on shifting stakeholder requests, ensuring a cohesive and effective framework. My personal and ongoing use of this kit for my client projects means any issues I encounter prompt immediate updates and refinements that benefit all users.
While I won't claim this is the ideal stack for every developer, it has effectively catered to 99% of my needs. For professionals crafting animation-driven and content-rich sites, its structure is likely to align closely with your requirements.
Proven Success in Real Applications
This kit isn't a polished side project; it's the bedrock upon which award-winning sites have been built.
Notable sites such as Good Fella, House of Honey, and Aspen Search have all utilized this foundation, earning accolades from Awwwards, FWA, and CSSDA. The time I once spent on tedious plumbing tasks is now redirected to the creative work that gets noticed most — and now others can benefit from that efficiency as well.
Reclaiming Your Time
The goal of this kit is simple: recover the early days of each project that previously disappeared before clients even saw any results. With this foundation, that precious time is returned to you, allowing for a greater focus on the high-value creative work your clients expect.
For anyone interested in this architecture, the thought processes behind each decision are fully documented, offering transparency and insight. The foundational knowledge is detailed across several articles, available on my blog, covering aspects such as CMS structure, content models, page composition, and content primitives.
If you're ready to bypass the trial and error of building from scratch, The Content Architecture is the resource I consistently use. One-time payment, continuous updates, and ownership are yours to enjoy. If you're uncertain whether it aligns with your workflow, feel free to reach out for a straightforward response, even if that means determining it's not the right fit for you.