The thesis
How a modern website stack fits together
A modern website is rarely one tool. It's a stack of choices: a framework that renders the site, a CMS that manages content, hosting that delivers it globally, and optional AI tooling layered on top.
What makes the modern stack compelling is not simply that parts of it are open source. It's that the stack is more portable, more flexible, and less dependent on a single vendor's roadmap. For teams that care about long-term control, that matters more than whether the software license itself is free.
The stack mindset changes the question from "which platform should we buy?" to "what is the right tool for each job?" That usually leads to better fit and fewer lock-in problems later.
Framework
Renders the site
Next.js, Astro, Remix, SvelteKit
CMS
Manages content
Sanity, Payload, Contentful, Strapi
Hosting
Delivers globally
Vercel, Cloudflare, Netlify
AI Layer
Builds & optimizes
Claude, GPT, self-hosted models
Frameworks
Which framework fits the stack best?
Each framework has strengths and trade-offs. Here's an honest assessment with our recommendation for when to use each one.
Next.js by Vercel
Our default recommendationReact-based, full-stack framework. The most widely adopted modern framework.
Best for: Companies that need a content-rich marketing site with dynamic features — personalization, A/B testing, authenticated sections, e-commerce.
Strengths: Massive ecosystem, excellent developer availability, server-side rendering and static generation in one framework, strong AI/ML integration.
Limitations: React runtime means slightly larger JavaScript bundles. Can be more complex than needed for simple brochure sites.
Our default recommendation for most mid-market marketing sites. The ecosystem, hiring pool, and flexibility are unmatched.
Astro
Best for pure content sitesComponent-agnostic framework built for content-heavy sites. Ships zero JavaScript by default.
Best for: Content-driven marketing sites, blogs, documentation — anywhere performance is the top priority.
Strengths: Fastest possible page loads, works with React/Vue/Svelte components, excellent SEO, extremely low hosting costs.
Limitations: Smaller ecosystem than Next.js. Less suited for highly interactive applications.
Our recommendation for pure content/marketing sites where blazing performance and low cost are priorities. The "islands architecture" is elegant.
Remix by Shopify
Best for e-commerceReact-based framework focused on web fundamentals — forms, progressive enhancement, nested routing.
Best for: E-commerce sites (Shopify ecosystem), applications with complex forms, teams that value web standards.
Strengths: Progressive enhancement means the site works without JavaScript. Excellent form handling. Deep Shopify integration.
Limitations: Smaller community than Next.js. Less ecosystem tooling.
The right choice when Shopify is part of the stack or when progressive enhancement is a hard requirement.
SvelteKit
Smallest bundle sizeFramework built on Svelte, a compiler that outputs minimal JavaScript.
Best for: Teams that want the smallest possible bundle size and the most intuitive developer experience.
Strengths: Tiny runtime, fast performance, best developer experience of the group, built-in routing and SSR.
Limitations: Smaller ecosystem and hiring pool. Fewer third-party integrations.
Excellent framework with the best developer experience. The ecosystem trade-off is real, but closing fast.
Headless CMS
Which CMS fits the stack best?
The CMS manages your content and delivers it via API. Here are the platforms we've worked with and our honest take on each.
Sanity
Most recommendedReal-time, structured content platform with a fully customizable editing studio.
Best for: Teams that need deep content modeling, real-time collaboration, and a highly customized editorial experience.
Pricing: Free tier (generous), then usage-based. No per-seat charges on most plans.
Our most frequently recommended CMS. The content modeling is best-in-class, and the editing experience rivals any traditional CMS.
Payload CMS
Full ownershipOpen source, self-hosted, TypeScript-native CMS and application framework.
Best for: Teams that want full ownership — code, data, hosting, everything. Developers who want a CMS that doubles as an app framework.
Pricing: Free and open source (MIT). You pay only for hosting.
The strongest play for teams who take the ownership thesis seriously. Pairs exceptionally with Next.js. You own the CMS itself.
Contentful
Enterprise incumbentEnterprise-grade headless CMS. The longest-tenured major player.
Best for: Large organizations with complex content operations, multi-brand/multi-market content, and enterprise compliance needs.
Pricing: Per-space pricing with usage limits. Can get expensive at scale.
The enterprise choice. Excellent for complex governance needs. Can be overkill (and overpriced) for mid-market.
Strapi
Quick setupOpen source headless CMS popular for its admin panel and quick setup.
Best for: Teams that want a self-hosted CMS with a polished admin UI and plugin ecosystem without going fully custom.
Pricing: Open source (community edition free). Cloud and enterprise editions available.
Good entry point for teams new to headless. At scale, Payload and Sanity offer more flexibility.
Storyblok
Best visual editorHeadless CMS with a built-in visual editor that marketers love.
Best for: Marketing teams that need a "what you see is what you get" editing experience without sacrificing headless architecture.
Pricing: Per-space with user limits.
The best editing UX for non-technical teams. If your marketing team's comfort is the top priority, Storyblok bridges the gap.
In practice
How the pieces fit together
Three common configurations covering the most typical use cases. The right timeline and cost depend on scope, integrations, governance needs, and how much of the workflow is already structured for AI-assisted delivery.
The Performance Stack
Content-first marketing siteShips zero JS by default. Fastest possible load times.
Best content modeling. Real-time collaboration. Free tier.
Fastest global edge network. Generous free tier.
Content, SEO, and performance optimization.
Result: Fast load times, low infrastructure overhead, and a strong editing experience for content teams. Best when performance and editorial speed matter more than application complexity.
The Full-Featured Stack
Dynamic sites & appsFull-stack React. SSR + SSG in one framework.
Live preview integration. Flexible content modeling.
Built by the Next.js team. Edge functions, analytics.
Semantic search, personalization, content gen.
Result: A flexible setup for teams that need both content and dynamic functionality in one codebase. Best when the site includes interactive tools, portals, or deeper integrations.
The Full-Ownership Stack
Maximum data sovereigntyMost flexible modern framework. Largest ecosystem.
Fully open source (MIT). Self-hosted. You own it.
Your servers, your data, your infrastructure.
Full control over AI data processing.
Result: Maximum control over code, content, infrastructure, and data handling. Best for teams with strong ownership requirements and the operational maturity to support it.
The math
How the cost model changes
The biggest difference is not one universal dollar amount. It's where the spend goes. Legacy SaaS platforms concentrate cost into recurring software contracts. Modern stacks shift more of that spend toward implementation, hosting, and support you can choose based on your needs.
| Legacy SaaS CMS | WordPress (managed) | Modern Stack | |
|---|---|---|---|
| Software licensing | Usually concentrated in a recurring platform contract | Lower software cost, with paid plugins or managed plans layered on | Often lower licensing cost, with more spend shifted to implementation and hosting |
| Hosting / infrastructure | Bundled into the platform experience | Varies by host, traffic, and plugin footprint | Usually usage-based and chosen independently from the CMS |
| Implementation complexity | Lower complexity up front, within the platform boundaries | Moderate complexity that grows with plugins and customizations | More architecture choices up front, but greater long-term flexibility |
| Editorial experience | Generally polished and tightly integrated | Familiar and flexible, but inconsistent across setups | Depends on CMS choice, with strong options for both structured and visual editing |
| Vendor dependency | High, because content, templates, and pricing live in one platform | Moderate, depending on host and plugin ecosystem | Lower when content, frontend, and hosting are intentionally decoupled |
| Security / maintenance responsibility | More vendor-managed, less operational control | More owner-managed across updates, plugins, and security | More engineering ownership, but fewer legacy platform constraints |
| Ability to replace one layer later | Lower, because the stack is more tightly coupled | Possible, but often messy depending on implementation choices | Highest when the architecture is designed for independent layers |
For many teams, the long-term advantage of a modern stack is not that it is always cheaper in every scenario. It's that the cost structure is more flexible, the dependencies are less concentrated, and the exit options are much better if the business changes.
Decision framework
Not sure which stack is right? Start here.
You don't need to evaluate every tool independently. Start with your primary use case, and the right combination becomes clear.
Content-first marketing site
Astro + Sanity + Cloudflare
Maximum performance, lowest cost, best content editing. Your marketing team gets a world-class visual editor. Your site loads faster than any SaaS CMS could achieve.
Marketing site + dynamic features
Next.js + Sanity + Vercel
The most popular modern stack. Blog, resource center, customer portal, interactive tools — all in one codebase. The largest ecosystem of integrations and developer talent.
E-commerce + content
Remix + Sanity + Vercel (or Shopify Hydrogen)
Deep Shopify integration. Progressive enhancement means the checkout works on any connection. Content and commerce in one experience.
Maximum ownership / data sovereignty
Next.js + Payload CMS + Self-hosted
You own every layer. CMS code, content data, server infrastructure. No vendor can change your pricing, access your data, or deprecate a feature. Best for regulated industries or strong ownership convictions.