# Installation

> Install @raf-query/react and effect with npm, pnpm, Yarn or Bun.

Apps install one package, `@raf-query/react`. It re-exports everything from `@raf-query/core`, so you never import core directly.

```bash
npm install @raf-query/react effect
# or
pnpm add @raf-query/react effect
# or
yarn add @raf-query/react effect
# or
bun add @raf-query/react effect
```

## Requirements

- **React 19.2 or newer.** raf-query reads data with `use()` and relies on transitions, Actions and `useOptimistic`.
- **`effect` 4.x** as a peer dependency. The cache is written in [Effect](https://effect.website), but an app that doesn't use Effect never imports it: `queryFn`s return promises, and the client, hooks and integrations speak promises. An app that does use Effect shares one copy with raf-query.
- **Node.js 22 or newer** for server rendering.

## Framework integrations

The TanStack Router integration and the devtools are subpath exports of the same package, so there is nothing else to install:

| Import                             | For                                                                     |
| ---------------------------------- | ----------------------------------------------------------------------- |
| `@raf-query/react/tanstack-router` | [TanStack Start and TanStack Router](https://raf-query.katt.dev/docs/tanstack-start.md) SSR streaming |
| `@raf-query/react/devtools`        | The [devtools](https://raf-query.katt.dev/docs/devtools.md) panel; omit the element to tree-shake it  |

[React Server Components](https://raf-query.katt.dev/docs/react-server-components.md) apps, such as the Next.js App Router, and [React Router Framework Mode](https://raf-query.katt.dev/docs/react-router.md) need no subpath: `QueryProvider` and `HydrationBoundary` come from `@raf-query/react`.

`@tanstack/react-router` is an optional peer: only apps that import `/tanstack-router` need it.

## TypeScript

raf-query is written in TypeScript and ships its types. Query data, inputs and errors are inferred from your [query factories](https://raf-query.katt.dev/docs/query-factories.md), so most apps never write a type argument. TypeScript 5.5 or newer with `strict` is recommended.

Next, build your first page in the [quick start](https://raf-query.katt.dev/docs/quick-start.md).