modern-react-spa

React Evolution at a Glance (v15 → v18)

Sat, 23 May 2026 00:00:00 GMT

React's history at a glance — v15, v16 (Fiber), v17, v18 — what carried forward into 19.2, and what got deprecated.

What's New in React 19.2

Sat, 23 May 2026 00:00:00 GMT

Every API and behavior change between React 19.0 and 19.2 — Compiler, Actions, use(), metadata, asset loading.

Modern Hooks Deep Dive

Sat, 23 May 2026 00:00:00 GMT

A deep look at the five always-needed React hooks, useTransition / useDeferredValue, useSyncExternalStore, custom hook patterns, and the anti-patterns the React Compiler will not save you from.

Component Architecture for SPAs

Sat, 23 May 2026 00:00:00 GMT

Component architecture for modern React SPAs — what replaced Container / Presentational, compound-component slots, error boundaries, and where to place Suspense in a real dashboard tree.

🔁 Chapter 5 · Routing in 2026 — Two Flavours

Sat, 23 May 2026 00:00:00 GMT

Picking between React Router v7 and TanStack Router in 2026 — file-based vs config-based, code-splitting at the route boundary, and auth-guarded routes.

📝 Chapter 6 · Forms Done Right

Sat, 23 May 2026 00:00:00 GMT

Forms in modern React — React Hook Form vs TanStack Form vs native

shadcn/ui Integration

Sat, 23 May 2026 00:00:00 GMT

shadcn/ui on React 19.2 + Vite — the copy-don't-install philosophy, CLI setup, Radix primitives, theming with CSS variables, and TanStack Table integration.

Icons, Tailwind & CSS Customization

Sat, 23 May 2026 00:00:00 GMT

Icons, Tailwind CSS v4, and design tokens for React 19.2 SPAs — icon library landscape, SVG delivery, CSS variables, tailwind-merge, dark mode, container queries.

Layouts — From CSS Flexbox/Grid to Dockable Workspaces

Sat, 23 May 2026 00:00:00 GMT

Modern CSS layouts for React — Flexbox, Grid, container queries, and JS-driven dockable workspaces (flexlayout-react, react-grid-layout).

Desktop & Shell UIs with Blueprint.js

Sat, 23 May 2026 00:00:00 GMT

Blueprint.js for desktop-style React SPAs — when it fits, setup on Vite + React 19.2, core components, theming, and the hybrid Blueprint + shadcn pattern.

Building a Component Library (with Storybook)

Sat, 23 May 2026 00:00:00 GMT

Building a React 19.2 component library — when it's worth it, package.json anatomy, Vite library mode, Storybook 9, Changesets publishing.

The Four Kinds of State

Sat, 23 May 2026 00:00:00 GMT

Every value in a React SPA belongs to one of four kinds of state — local, global, server cache, or URL. A decision flowchart that ends the 'which library should I use' debate.

Global State — Zustand, Jotai, Recoil, Redux Toolkit

Sat, 23 May 2026 00:00:00 GMT

Picking a global-state library for React 19 SPAs — Zustand, Jotai, Recoil, Redux Toolkit. Selectors, render storms, the 7-question checklist, and why useContext is rarely the answer.

Server State — TanStack Query (React Query)

Sat, 23 May 2026 00:00:00 GMT

TanStack Query (React Query) for server state in React 19.2 — cache-key-as-contract, optimistic mutations, prefetching, devtools, and pairing with Zustand.

URL as State

Sat, 23 May 2026 00:00:00 GMT

URL as state in React — typed search params with nuqs or TanStack Router, shareable filter UIs that survive reload, and multi-tab persistence.

The Bundler Landscape in 2026

Sat, 23 May 2026 00:00:00 GMT

The 2026 React bundler landscape — Vite, Bun, Parcel, Rspack, Turbopack, esbuild — what each is for, and when (not) to switch.

Vite Deep Dive

Sat, 23 May 2026 00:00:00 GMT

Vite for React 19.2 — dev-server internals, Rollup production builds, plugins, env vars, path aliases, SVG modes, SSR/SSG mode, and debugging Vite itself.

Bun & Deno — New JavaScript Runtimes for React SPAs

Sat, 23 May 2026 00:00:00 GMT

Bun and Deno for React SPAs in 2026 — runtime differences from Node.js, side-by-side benchmarks, and a migration playbook.

Monorepo Configuration — Workspaces, Turborepo, Nx, with a Bun focus

Sat, 23 May 2026 00:00:00 GMT

Monorepo configuration for React projects — npm/pnpm/Bun/Yarn workspaces, Turborepo vs Nx, CI affected-only builds, and Changesets versioning.

Parcel, Rspack, Turbopack — when they fit

Sat, 23 May 2026 00:00:00 GMT

Parcel, Rspack, Turbopack — the narrow situations where each is a better fit than Vite, and an honest take on when not to switch.

Migrating from CRA / Webpack to Vite

Sat, 23 May 2026 00:00:00 GMT

Migrating a CRA or Webpack 4 SPA to Vite — pre-flight audit, step-by-step migration script, Jest-to-Vitest, and a 1,400-file real-world case study.

The SSG Spectrum

Sat, 23 May 2026 00:00:00 GMT

Pure SPA, SSG, SSR, ISR — the rendering spectrum for React in 2026, and how to pick per-page based on SEO, TTI, build time, and data dynamism.

SSG Tools for React

Sat, 23 May 2026 00:00:00 GMT

Picking an SSG for React in 2026 — Astro, Next.js static export, Vite SSG, Gatsby today, smaller players, with a clear picker.

Hybrid — SPA Shell + Pre-rendered Pages

Sat, 23 May 2026 00:00:00 GMT

The most common real-world React deployment shape — pre-rendered marketing at /, SPA at /app/*. Shared design system, deployment, and routing handoff.

Architecting a Multi-Team SPA

Sat, 23 May 2026 00:00:00 GMT

Architecting a multi-team React SPA — monorepo vs polyrepo at the organisational level, shared design systems as packages, and versioning strategies for shared code.

Module Federation in Depth

Sat, 23 May 2026 00:00:00 GMT

Module Federation for React 19.2 — host/remote/shared scope, Vite + Rspack setups, runtime vs build-time, sharing React/router/store, and the six failure modes you will hit.

Running Different React Versions Together

Sat, 23 May 2026 00:00:00 GMT

Mixed React-version SPAs — why they exist, four isolation strategies, sharing state across React trees, and what breaks across major versions.

Enterprise Concerns

Sat, 23 May 2026 00:00:00 GMT

Enterprise React SPA concerns — OIDC / BFF auth patterns, multi-tenancy with per-tenant theming and feature flags, i18n at scale, and accessibility compliance pipelines.

State Management Complexity at Scale

Sat, 23 May 2026 00:00:00 GMT

State at scale — per-remote stores vs shared store in federated SPAs, cache coherence across micro-frontends, and the shadow Redux anti-pattern.

The Performance Budget

Sat, 23 May 2026 00:00:00 GMT

Defining and enforcing a performance budget for React SPAs — Core Web Vitals (INP, LCP, CLS), CI gates that block regressions, and RUM vs lab telemetry.

Bundle Optimization

Sat, 23 May 2026 00:00:00 GMT

Bundle optimization for React 19.2 — reading the bundle visualizer, route-level code-splitting, dependency cost analysis, and replacing heavy libraries.

Runtime Performance

Sat, 23 May 2026 00:00:00 GMT

Runtime performance for React 19.2 SPAs — DevTools Profiler, what the compiler optimises, list virtualization, avoiding render storms, and web workers for CPU-bound work.

Network Performance

Sat, 23 May 2026 00:00:00 GMT

Network performance for React SPAs — HTTP/3 awareness, React 19.2 resource hints (preload, preinit), image strategy, and service workers for offline-first.

Debugging Strategies

Sat, 23 May 2026 00:00:00 GMT

Debugging React 19.2 SPAs — React DevTools (Components + Profiler), TanStack Query Devtools, state-store devtools, production source maps, and Sentry / Datadog RUM.

Hard Bugs and How to Find Them

Sat, 23 May 2026 00:00:00 GMT

The five hardest React SPA bug classes — stale closures, hydration mismatches, memory leaks, render-loop traps, and race conditions — with debugging recipes.

Testing Modern React SPAs — the Full Pyramid

Sat, 23 May 2026 00:00:00 GMT

Testing modern React 19.2 SPAs across the pyramid — Vitest, Jest migration, React Testing Library, Playwright, visual regression with Chromatic, and Storybook play functions.

Delivery Pipelines

Sat, 23 May 2026 00:00:00 GMT

Delivery pipelines for React SPAs — GitHub Actions matrix for Node + Bun + Deno, preview deploys on Vercel / Netlify / Cloudflare Pages, OpenFeature flags, and SPA canary releases.