How to type nested JSON API responses in React with TypeScript and TanStack Query?

Type nested JSON API responses in TanStack Query using TypeScript generics and interfaces. Define interfaces matching API response structure: interface User { id: number; profile: { name: string; settings: Settings } }. Use useQuery with type parameters: useQuery<User>({ queryKey: ["user"], queryFn: fetchUser }). For complex nested structures, compose smaller interfaces: interface Profile extends BaseProfile { metadata: Metadata }. Use Zod or io-ts for runtime validation ensuring API responses match TypeScript types. Generate types automatically from OpenAPI specs with tools like openapi-typescript. Extract nested types for reusability: type UserProfile = User["profile"]. Use utility types like Pick, Omit, and Partial for derived interfaces. Discriminated unions handle polymorphic responses. Type guards validate structure at runtime. Validate API responses with our JSON Validator at jsonconsole.com/json-editor before defining types. TanStack Query infers return types from query functions automatically. Proper typing catches mismatches early and enables autocomplete, making nested JSON navigation type-safe throughout your application.