Case study
Form architecture for a large-scale case-management platform
Context
As lead frontend architect overseeing multiple engineering pods across several concurrent campaigns on a large government caseworker platform, forms had grown ad hoc — no shared library, no consistent validation approach, and accessibility and type-safety handled differently depending on which pod touched a given form last.
Problem
The team needed a form foundation that could satisfy several hard constraints at once: server-side-rendering-compatible ("isomorphic") validation for a low-bandwidth environment, WCAG 2.1 AA accessibility, first-line defense against malformed or malicious input, and a shape the design system's not-yet-built component library could eventually plug into — without throwaway work in the meantime.
Contribution
Ran the research spike, evaluated three competing form libraries against five weighted requirements (validation, accessibility, type safety, design-system fit, developer experience), and authored the architecture decision recommending TanStack Form paired with Zod. Then architected and built the shared-UI form primitives — reusable, pre-validated, accessible field components with TanStack Form already wired in, backed by shared Zod validation schemas so a form's validation rules live in one place and get reused across every context that needs them, rather than redefined per form. Any team could compose a complex form by assembling primitives instead of re-solving validation, accessibility, and schema logic from scratch each time. Delivered as a phased rollout (foundation utilities first, then design-system integration) and a 5-part stacked extraction into the shared component library, with migration guides so other teams could adopt independently.
Outcome
Every form across a large, multi-team platform now follows one documented, type-safe, accessible pattern instead of ad hoc handling. The architecture proved itself under a harder real case: a subtle validation bug — a submit button staying permanently disabled after certain interactions — turned out to be a symptom of forms wiring the same validation rules differently depending on where they were used. Rather than patch it locally, the fix became a second architectural layer, guaranteeing a form's validation rules run identically no matter where they're triggered, then rolled out across the app's existing forms and documented as the standard every new form follows.