How this site is built
— and why.
A short explainer for the Quality Roofing site: the stack we chose, what we considered, and what it means for the business going forward.
Server-rendered React with file-based, fully typed routing. 60+ pages ship as real HTML with real meta tags.
Zero-config GitHub deploys, preview URLs per pull request, global CDN.
Postgres with row-level security for leads, plus Edge Functions hosting the AI assistant.
- SSR for SEO. Google and link previews see fully rendered pages, not blank JS shells.
- Typed routing. 60+ pages — services, 12 service-area cities, projects, insights, FAQ, tools — with type-safe links and params.
- Built-in server functions. Estimator, scheduler, financing, claim assistant — no separate backend project.
- Portable. Runs on Vercel, Cloudflare, Netlify, or self-hosted with a one-line config change.
- Push to deploy. GitHub commit → live in under a minute. Every PR gets a preview URL.
- Global CDN. Pages serve fast from the edge anywhere a customer is searching.
- Predictable pricing. Pay for the traffic you actually use — no surprise bills.
- Easy handoff. Any developer or agency can take over without onboarding to a proprietary platform.
Postgres with row-level security. Stores chatbot leads today; ready for customers, projects, or any future records.
Host the AI assistant. The AI key lives in one place, so the chatbot works on any host with zero env-var setup.
Already wired up if you ever add a customer portal, document uploads, or admin dashboard.
Equivalent capability — but no benefit to switching. We'd lose TanStack Router's typed params and rebuild what already works.
Slower pages, plugin sprawl, can't cleanly host the estimator, scheduler, claim assistant, or AI chat.
Fine for brochure sites — but can't host the custom tools or AI assistant, and monthly cost climbs at scale.
No server rendering means weak SEO and slow first paint. A non-starter for a marketing site.
- →Fast pages and strong SEO — every route is server-rendered with its own title, description, and OG image.
- →Predictable hosting cost — pay only for what traffic actually uses.
- →No vendor lock — the same code runs on Vercel, Cloudflare, Netlify, or self-hosted with a config swap.
- →Easy to extend — any React developer can add pages, tools, or integrations.
- →Owned data — leads and content live in your Supabase project, not a third-party CMS.
A modern, server-rendered React site on a developer-friendly host, with a real database and AI layer behind it.
Fast for visitors, cheap to run, easy to extend, and not locked to any single vendor.