BuildBot

The New Model

The landscape: frameworks, CSS & data

Lesson 4 of 4

What you'll learn

  • Place the frameworks worth knowing on a map
  • Know what native CSS can now do (and what it replaced)
  • Update your mental list of databases and ORMs

Frameworks

The throughline since 2021 is fine-grained reactivity (signals) and shipping less JS:

  • Next.js — dominant React meta-framework (App Router, RSC).
  • Astro — content-first, islands; near-zero JS by default.
  • React Router v7 — Remix folded back into it; full-stack React.
  • TanStack Start — rising, type-safe full-stack.
  • Svelte 5 (runes) and SolidJS — signals-based reactivity; Qwik — resumability; Vue 3 / Nuxt.
  • Tooling: Vite won; Create React App is dead.

CSS caught up

A lot of what needed a library in 2021 is now native CSS — so you often reach for Tailwind + plain CSS instead of CSS-in-JS:

/* native nesting, container queries, :has(), color-mix, oklch */
.card {
  &:has(img) { padding-block: 1rem; }
  @container (min-width: 30rem) { display: grid; }
  background: color-mix(in oklch, var(--brand) 12%, white);
}

Plus the View Transitions API for animated route/state changes, subgrid, cascade layers, and @property. Component-wise, headless (Radix) + copy-own (shadcn/ui) replaced heavy component kits.

Databases & ORMs

Past Postgres / MySQL / Mongo:

  • Postgres is the default again — with pgvector (RAG), PostGIS; serverless via Neon / Supabase.
  • SQLite at the edgeTurso / libSQL, Cloudflare D1, local-first.
  • Vector DBs for AI — Pinecone, Qdrant, Weaviate (or pgvector).
  • OLAP — DuckDB, ClickHouse. ORMsDrizzle (SQL-first, rising) vs Prisma.

The unifying idea

Server-first rendering, signals, edge data, and native-platform features all point the same way: do more at the edge/server, ship less to the browser, and let the platform (CSS, the runtime) do work libraries used to.

The challenge models the signals idea underneath Svelte/Solid/Vue: a value with dependents that recompute only when their source changes. Run it.

Signals, modeled

Run it. A derived value recomputes only when a signal it depends on actually changes — fine-grained reactivity in miniature.

Loading editor…

That's the catch-up: server-first React, a compiler that memoizes for you, state split into server and client, and a platform (frameworks, CSS, data) that does more so your code ships less.

Knowledge check

What is the unifying direction behind RSC, signals, edge data, and native CSS features?

Saved on this device. Sign in to sync your progress everywhere.