Custom front-end

ObjectStack gives you three ways to build UI the Console does not draw for you. Pick by where the UI runs and who renders it.

The first path is metadata like any other page, so it is documented with User Interface. The rest of this section is the ObjectUI SDK.

The ObjectUI SDK

The ObjectUI SDK is the set of MIT-licensed @object-ui/* packages that render ObjectStack JSON schemas inside your own React app. JSON metadata goes in, and accessible, themeable components built with Tailwind CSS, Shadcn UI and Radix primitives come out.

npm install @object-ui/react @object-ui/components

The ObjectStack Console is built from these same packages: it reads your stack's metadata from the server and renders it through the renderer and component registry described here. If the Console already does what you need, you author metadata and never touch the SDK.

A small schema

{
  "type": "data-table",
  "caption": "Users",
  "className": "rounded-lg border",
  "columns": [
    {
      "header": "Name",
      "accessorKey": "name",
      "sortable": true
    },
    {
      "header": "Email",
      "accessorKey": "email"
    }
  ],
  "data": [
    {
      "name": "Ada Lovelace",
      "email": "ada@example.com"
    },
    {
      "name": "Grace Hopper",
      "email": "grace@example.com"
    }
  ]
}

That schema renders through SchemaRenderer once @object-ui/components has been imported for its registration side effects.

What's in this module