Back to templates

Template details

admin-on-rest

A frontend framework for building admin SPAs on top of REST services, using React and Material Design.

About this template

admin-on-rest is an open-source frontend framework for building admin applications in the browser on top of REST services, using React and Material Design, maintained by marmelab. It turns any REST API into a full-featured admin interface with list, edit, and create views, and is the predecessor of the actively developed react-admin (version 2.x).

What is admin-on-rest?

admin-on-rest is a frontend framework that takes a REST client and a set of React components configured through <Resource> definitions, and produces a running single-page admin application with a Material Design look. It runs entirely in the browser, uses ES6, and is built on React, Redux, redux-form, redux-saga, material-ui, and recompose. The framework is open sourced and maintained by marmelab, the team behind the older Angular-based ng-admin library.

Key Features

  • REST client adapter — connects to any REST backend by using an existing REST client or writing a custom one; the documentation states this takes a matter of hours.
  • Optimistic rendering — the interface updates before the server responds, making actions feel instant.
  • Relationship support — handles many-to-one and one-to-many relationships between resources out of the box.
  • Internationalization (i18n) — built-in support for translating labels and messages into multiple languages.
  • Authentication provider flexibility — works with REST API, OAuth, Basic Auth, or any custom authentication provider.
  • Full-featured Datagrid — includes sorting, pagination, and filter-as-you-type search for listing records.
  • Flexible form layouts — supports simple, tabbed, and custom layouts with built-in data validation and a WYSIWYG editor.
  • Extensible architecture — every part is a React component, so you can replace the dashboard, menu, layout, datagrid, or even swap REST for GraphQL or Material Design for Bootstrap.

Who is it for?

  • React developers — build a complete admin interface for a REST API in minutes by defining <Resource> components with list, edit, and create sub-components.
  • Product teams — create internal dashboards for managing users, orders, content, or any data without writing boilerplate CRUD code.
  • Agencies and freelancers — deliver custom admin panels to clients by reusing a consistent component library and theming options.
  • Developers migrating from ng-admin — admin-on-rest is the React successor to marmelab's Angular-based ng-admin, using similar concepts.

Use cases

  • Blog administration: manage posts with text inputs, date fields, and rich text editing, as shown in the official tutorial and demo.
  • E-commerce back office: use the Datagrid with sorting, pagination, and filters to manage product catalogs and orders.
  • Multi-backend dashboards: reuse the same admin shell to connect to several REST APIs by swapping the REST client and resource definitions.
  • Custom admin extensions: replace the default dashboard, menu, and layout with your own React components to match a company's branding.

How does admin-on-rest work?

After installing via npm install --save-dev admin-on-rest, you create a REST client (for example simpleRestClient('http://localhost:3000')) and define resources with list, edit, and create components. The <Admin> component mounts the whole app, and the <Resource> component wires each view to the REST client. You can run the bundled example with make run and browse to the local address.

Alternatives

  • react-admin — the version 2.x successor of admin-on-rest, maintained by the same team and built on the same concepts.
  • ng-admin — the older Angular-based admin generator by marmelab that inspired admin-on-rest.

Pros and cons

Pros:

  • Free and open source under the MIT License.
  • Works with any REST API through the REST client adapter approach.
  • Optimistic rendering and filter-as-you-type improve user experience.
  • Highly customizable because it is just React components.

Cons:

  • Version 1.x is in maintenance mode; new feature development happens in react-admin.
  • Building a custom REST client is required for non-standard APIs, though the page says this takes only hours.

Pricing

admin-on-rest is completely free to use, including for commercial purposes, under the MIT License. The authors suggest donating to a charity such as Doctors Without Borders instead of paying for the library.

FAQ

Is admin-on-rest free?

Yes. It is licensed under the MIT License and free to use, even for commercial projects. The maintainers suggest donating to charity rather than paying.

Does admin-on-rest work with my REST API?

Yes. It uses an adapter approach with REST clients. You can use an existing REST client as a blueprint or write a custom one, which the documentation says takes a matter of hours.

Is admin-on-rest still maintained?

Version 1.x is in maintenance mode, meaning only bugfixes are likely. Version 2.x continues as the separate project react-admin, which is actively developed.

What technologies does admin-on-rest use?

It is built with ES6, React, and Material Design using material-ui, and integrates Redux, redux-form, redux-saga, and recompose.

How do I install admin-on-rest?

Run npm install --save-dev admin-on-rest, then import the components you need and define a REST client and resources. The documentation includes a 15-minute tutorial to get started.

screenshot of admin-on-rest on template0.com