Building UIs

These guides cover how to use the ui-react module and use React hooks and components to easily build reactive user interfaces with TinyBase.

See also the Countries demo, the Todo App demos, and the Drawing demo.

Getting Started With ui-react

To build React-based user interfaces with TinyBase, you will need to install the ui-react module in addition to the main module, and, of course, React itself.

Using React Hooks

There are reactive hooks in the ui-react module for accessing every part of a Store, as well as more advanced things like the Metrics and Indexes objects.

Using React Components

The reactive components in the ui-react module let you declaratively display parts of a Store.

Using React DOM Components

The reactive components in the ui-react-dom module let you declaratively display parts of a Store in a web browser, where the ReactDOM module is available.

Using Context

The ui-react module includes a context provider that lets you avoid passing global objects down through your component hierarchy.