> ## Documentation Index
> Fetch the complete documentation index at: https://instantdb-react-ui.kirankunigiri.com/llms.txt
> Use this file to discover all available pages before exploring further.

# What is this?

> A library of react components for InstantDB

`instantdb-react-ui` is a library of react components that seamlessly connects your frontend and backend code with InstantDB.

* Data queries and updates are automatically built into your UI components.
* Uses Tanstack Form under the hood to give you type-safety access to all your InstantDB schema entities and fields.
* No more spending time writing manual db mutations or `onSubmit` handlers for every single UI element!
* Automatically load and handle relations and link pickers for all cardinality types
* Debounce/throttle server-side updates forany field with one line of code
* Add `zod` to your instant schema for automatic frontend validation. Our ui components will automatically use zod validation + defaults to show errors and handle your forms.

This library includes two main components with different modes.

* Forms (create and update)
* Lists (normal, infinite, paginated)

<Note>This is not an official library by InstantDB. It is a community-driven project, and PR's are always welcome to improve the project.</Note>

### Check out the demo

<Card color="#339AF0" horizontal title="Compare" icon="code-compare" href="https://instantdb-react-ui-demo.kirankunigiri.com/compare">
  View a direct comparison of `instantdb-react-ui` vs. manually writing your own form
</Card>

<Card color="#339AF0" horizontal title="Live Demo" icon="browser" href="https://instantdb-react-ui-demo.kirankunigiri.com">
  View an example app with lists and complex forms
</Card>