# Introduction
URL: /tap/docs/overview/introduction

tap: React hooks, headless

> For AI agents: a documentation index is available at [llms.txt](/llms.txt). Use `.md` for canonical markdown pages; `.mdx` is kept as a backwards-compatible alias on supported URL paths.

Quickstart

Learn how to build your first resource with tap.

[Get started →](/tap/docs/tap/quickstart)

```
import { resource } from "@assistant-ui/tap";
import { useState } from "react";

const useCounter = () => {
  const [count, setCount] = useState(0);

  return { count, increment: () => setCount((c) => c + 1) };
};

const Counter = resource(useCounter);
```

**tap is React's hooks, headless.** You write a `resource` the same way you write a React component, with the same hooks (`useState`, `useEffect`, `useMemo`, ...) imported from `"react"` and the same rules. The only difference is that a resource has no UI: instead of returning JSX, it returns a plain value (state and methods), and it runs anywhere, inside a React component, inside another resource, or standalone with no React at all.

If you know React hooks, you already know tap. There are only three new things:

1. You write a `use`-prefixed hook and wrap it with `resource(useName)`; the unit returns a value instead of JSX.
2. You instantiate it by calling the factory (`Name(props)`) to get an element, then host it with [`useResource`](/tap/docs/tap/resources#hosting-a-resource).
3. A resource tree can run [outside React](/tap/docs/tap/outside-react) entirely.

## Next steps

- [Quickstart](/tap/docs/tap/quickstart) —

  Install tap and build your first resource.

- [Resources](/tap/docs/tap/resources) —

  Author, compose, and host resources.

- [API Reference](/tap/docs/tap/api-reference) —

  Every export, in one place.