Your stack

AI agent for React applications

A React frontend is one half of the picture: it shows what a user can do and in what order, while the backend defines what is actually permitted. Merlean reads both, and executes against the backend.

What Merlean reads in a React codebase

Merlean connects to your repository through GitHub or GitLab and analyses the application rather than recording a user clicking through it. In a React project, that analysis draws on:

  • Router configuration, so the analyser knows which screens exist and what they are for.
  • The data-fetching layer - fetch and axios calls, React Query hooks, server actions - which reveals the real endpoints and payloads.
  • Form components and their validation schemas, including Zod, Yup and React Hook Form resolvers, which give field names, types and conditional logic.
  • Component state that gates a workflow, such as a step that only unlocks once an earlier choice is made.
  • The API or backend repository, when it is connected, for the authoritative permission rules.

The result is a machine-readable model of what the application can do, which fields each action needs, which order multi-step work has to run in, and who is allowed to run it. That model is what user requests are resolved against.

Authentication and permissions

Merlean uses whatever your frontend uses: a session cookie, a bearer token in local storage, or an authorization header. The requests it issues carry the signed-in user's credentials, so your backend applies the same checks it always has.

Worth knowing about React specifically

  • A typed API client or generated schema improves accuracy considerably, because the analyser gets exact payload shapes rather than inferring them from call sites.
  • Client-side-only validation is a common trap: if a rule exists in the form component but not on the server, Merlean will follow the server, which is the correct behaviour but occasionally surprising.
  • Connecting the backend repository as well as the frontend is worth doing. Frontend-only analysis produces a model of what the interface offers, not of what the system permits.

Getting started

Connect the repository, run the first analysis, and review what Merlean understood. Reviewing is the step worth spending time on: the analysis is derived from your code, so where it is wrong it is usually pointing at something genuinely ambiguous in the application.

Then add the widget with a single script tag, or expose the application over the Model Context Protocol so an AI agent your users already use can reach it.

Frequently asked questions

Does Merlean drive the browser or the API?

The API. It does not click through your components, which is why interface changes and re-renders do not break it. The frontend is read for context about workflows and fields.

Do I need to connect the backend repository too?

It is strongly recommended. The frontend describes intent and layout; the backend describes truth about permissions and validation.

Does it work with Vite, Create React App or a custom build?

Yes. The analyser reads source, not build output, so your bundler is irrelevant.

See it against your own application

Merlean reads your repository and shows you what it understood before anything is exposed to a user. The fastest way to judge the fit is to point it at a real codebase.

Get in touch Read the docs

Related