react-resource-view
Concepts
The vocabulary in one page — resource, view, dialect, port, scope… — and how the pieces fit together.
The rest of the documentation uses a handful of words in a sense of its own. This page puts them side by side, once: what each one means, and where it is documented in full. Elsewhere, a word in bold that links here is one of them.
The whole picture#
Everything starts from one declaration. Its form and its layouts are what the screens are drawn from; its repository is where the data comes from, and the dialect is how that data is asked of your API. The application stays in charge of what the library cannot know — which router, which API, which name — and hands it over through ports.
createViewResource("articles", { … })
Fields described as data, rendered by react-data-form — one controller per field.
Table, cards, board, split, calendar, timeline — the reader picks.
HTTP when the resource has a path, localStorage with storage: "local".
JSON-LD, Strapi, Supabase, FastAPI, Django, Spring Boot — or your own.
Ports
Injected once, at startup — the library chooses none of them.
- router
configurePorts - navigation and routing mode, used by every view
- brand
configurePorts - appName and description, written into the page head
- api
configureApi - baseUrl, token and dialect, used by the repository
Glossary#
- Resource
Something your API exposes as a collection — articles, users, orders — declared once with
createViewResource. Every screen of the library is derived from that one declaration.- View
One of the five screens a resource gets: list, read, create, update and delete. The root of the declaration is what they all start from;
views.<action>adjusts it for a single action, merged deeply.- Layoutalso: view variant
How a list is drawn — table, cards, board, split, calendar, timeline or plain items, each a function of the
layoutnamespace. A resource declares several inviews.list.layouts, and the reader switches between them; the choice is kept in the URL.- Form
The fields of a resource, described as data and rendered by react-data-form. The same description is the create and edit forms, the table's columns and the payload the API receives.
- Controller
The component that renders and edits one field — a text input, a select, a date picker, a file upload. A field names its controller; writing your own takes two props.
- Repository
What reads and writes a resource's data.
createViewResourcepicks one for you: an HTTP repository when the resource has apath, a localStorage one when it declaresstorage: "local"— or takes yours, given inrepository.- Dialect
How a given backend spells URLs, pages, filters, collections and validation errors. The repository speaks through it, so the same declaration runs against API Platform, Strapi, Supabase, FastAPI, Django or Spring Boot.
- Port
What the library asks of the application hosting it instead of choosing for it: the router and the routing mode, the application's name and description through
configurePorts, the API and its dialect throughconfigureApi. Both are called once, at startup.- Scope
An area of the application — a back office, a customer portal — that lists its own resources in
resources, with its menu, layout and access rule. Its name is the first segment of every URL the views build.- Registry
The shared list where
createViewResourcerecords each resource under its id, so a view, a link or a sub-view can find a resource by name. It is a module-level singleton, which is whyresource-registryis a peer dependency.- Sub-viewalso: tab
A view of another resource nested in a detail page, as a tab declared in
views.read.tabs— an author's articles under the author. It is a full view: it fetches, filters, paginates and writes.