Skip to content
Now accepting Q2 projects — limited slots available. Get started →
Stack Picker

What should you build with?

Adjust the sliders below to match your priorities. We'll recommend the best stack for your needs.

How the stack picker works

1

Set your priorities

Each slider represents a dimension that matters for your project, raw performance, content editing flexibility, developer experience, SEO capability, and budget sensitivity. Slide toward 5 for things that are non-negotiable, toward 1 for things you're willing to compromise on.

2

Weighted matching

Your slider positions become weights in a scoring algorithm. Each of our six pre-vetted stacks has fixed scores across all five dimensions, based on real-world project outcomes. Your weights determine which stack characteristics matter most in the final ranking.

3

Ranked recommendations

You get the top three stacks ranked by match percentage, each with a breakdown of framework, CMS, and hosting provider. The "Best Match" reflects the closest alignment to your stated priorities, not a generic "best" for everyone.

Why stack selection is the most expensive decision you'll make

Choosing the wrong tech stack rarely hurts you immediately. The site ships, the client is happy, everything works. The pain shows up 12-18 months later when you need to add a feature your framework doesn't support well, or your hosting bill triples because you picked an architecture that doesn't scale efficiently, or your team can't hire developers because nobody wants to work with your CMS anymore.

We've migrated enough sites to know what the wrong choice looks like. A marketing team stuck with a headless CMS that requires a developer for every content change. An ecommerce site built on a static generator that now needs dynamic user accounts. A blog running Next.js when all they needed was Astro, paying for server-side rendering they'll never use. Each of these is a $15K-$40K mistake that could have been avoided with 30 minutes of honest priority-setting upfront.

The six stacks in this tool aren't theoretical combinations, they're battle-tested across our client portfolio. Astro + Supabase + Vercel is our default for content-heavy sites that need to rank well and load fast. Next.js + Sanity enters the picture when editorial teams need real-time previews and complex content models. The "right" stack depends entirely on what matters to you, which is why this tool starts with your priorities and works backward to the technology.

Frequently asked questions

What frameworks are included?
The picker evaluates six production-tested stacks: Astro + Supabase + Vercel (our default for performance-first sites), Next.js + Sanity + Vercel (best for content-heavy editorial workflows), Next.js + Contentful + AWS (enterprise-grade with localization support), Astro + Payload + Netlify (self-hosted CMS with full TypeScript), Remix + Strapi + Fly.io (developer-focused with progressive enhancement), and WordPress Headless + Next.js (familiar editing, modern frontend).
How are the stacks scored?
Each stack has a fixed score from 1-5 across the five dimensions, based on real client outcomes, not benchmarks or marketing claims. Astro scores 5/5 on Performance because it ships zero JavaScript by default. WordPress Headless scores 5/5 on Content Flexibility because editors already know the interface. Your slider positions act as weights, so a stack that scores 3/5 on a dimension you rated as 1 barely affects the final ranking.
Can I use a stack not listed here?
Absolutely. These six represent the combinations we recommend most based on results. If you have a specific requirement, Shopify for ecommerce, a legacy CMS your team is committed to, or a framework your developers prefer, the sliders still help clarify your priorities. Knowing whether you value performance over content flexibility is useful regardless of which stack you ultimately choose.
What if my priorities change after I build?
This is the most common risk with stack decisions. A site built for performance-first might later need a richer editorial experience. The best mitigation is choosing stacks with clear upgrade paths, Astro can add interactive islands, Next.js can switch between static and dynamic rendering per page, headless CMSes can be swapped without touching the frontend. We specifically selected stacks that don't box you into a single pattern.
Why does SEO capability matter for stack selection?
Framework-level SEO support determines how much custom work you need for technical SEO at scale. Static generation means pre-rendered HTML that Google indexes instantly. Built-in head management means proper meta tags without a plugin. Automatic sitemap generation means new pages are discoverable immediately. Frameworks without these defaults require significantly more development time, and the work is invisible to stakeholders until rankings drop.
Get in touch

Let's build
something together.

Whether it's a migration, a new build, or an SEO challenge — the Social Animal team would love to hear from you.

Get in touch →