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)
This is not an official library by InstantDB. It is a community-driven project, and PR’s are always welcome to improve the project.

​
Check out the demo

Compare

View a direct comparison of instantdb-react-ui vs. manually writing your own form

Live Demo

View an example app with lists and complex forms