TanStack React Query v5 & TypeScript

The Intelligent React Query Generator for Modern Web Apps

Generate complete, production-ready React Query hooks, query key factories, and TypeScript interfaces from OpenAPI and Postman collections with zero manual wiring.

Launch Reex Studio Documentation

Real Code on Disk

Outputs readable, editable TypeScript files directly into your repository. No black-box runtime dependencies or proprietary vendor lock-in.

Automatic Invalidation

Every mutation is generated with an onSuccess handler that calls queryClient.invalidateQueries with the exact matching query key factory.

Structured Query Key Factories

Generates hierarchical query key objects per API domain, adhering to official TanStack Query best practices for cache isolation.

ts-morph AST Engine

Modifies and updates code via TypeScript Abstract Syntax Tree manipulation. Safely integrates new endpoints without corrupting your customized code.

Integrated Auth Strategies

Generates auth handlers for JWT Bearer tokens with automated refresh or W3C-standard secure HTTP-only cookies out of the box.

Live Bidirectional Sync

Edit endpoint definitions in VS Code or Reex Studio. Changes flow in both directions in real-time via the lightweight local daemon.

Clean, Idiomatic React Query Output

Inspect the generated code below. Clean imports, strict typing, and full support for React Query v5 hooks.

// Generated in src/api-services/hooks/useAccountReportsQueries.ts
import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
import { accountReportsApi, type CreateAccountReportPayload } from "../definitions/accountReports";

export const accountReportsKeys = {
  all: ["accountReports"] as const,
  lists: () => [...accountReportsKeys.all, "list"] as const,
};

export const useGetAccountReportsQuery = () => {
  return useQuery({
    queryKey: accountReportsKeys.lists(),
    queryFn: () => accountReportsApi.get_accountReports(),
  });
};

export const usePostAccountReportsMutation = () => {
  const queryClient = useQueryClient();
  return useMutation({
    mutationFn: (payload: CreateAccountReportPayload) =>
      accountReportsApi.post_accountReports(payload),
    onSuccess: () => {
      queryClient.invalidateQueries({ queryKey: accountReportsKeys.all });
    },
  });
};

Start Generating in 3 Steps

Install & Start the Local Bridge

In your project root, run npm i -g reex-cli followed by reex start. The daemon opens a secure local listener.

Connect Reex Studio

Open Reex API Studio. It connects securely to your local codebase without requiring any cloud tokens or proxies.

Import Endpoints & Consume

Import an OpenAPI or Postman spec, test your endpoints, and use the generated hooks like useGetAccountReportsQuery() straight inside your React or Next.js components.