React Admin

React Admin is a frontend framework for building single-page admin applications on top of REST or GraphQL APIs, using TypeScript, React, and Material Design. Maintained by marmelab since 2016, it ships with more than 45 data-provider adapters, so it can connect to virtually any backend without custom glue code.

It bundles the building blocks admin UIs need out of the box: authentication and authorization, routing, forms and validation, data grids, filters, relationships, rich text editing, i18n, notifications, and theming. Because everything is a replaceable React component, teams can start with the defaults and progressively customize down to the pixel.

What You Get

• A backend-agnostic data provider interface with 45+ community adapters for REST, GraphQL, Firebase, Supabase, and more
• Prebuilt CRUD screens (List, Edit, Create, Show) with sorting, filtering, pagination, and bulk actions
• Authentication and role/permission-based access control via a pluggable authProvider
• Form handling and validation built on react-hook-form, with optimistic UI, undo, and saved queries
• Internationalization, theming, and Material UI-based components that can be swapped for custom ones
• A CLI (create-react-admin) to scaffold new projects and Storybook-driven component development

Common Use Cases

• Building an internal admin dashboard on top of an existing REST or GraphQL API
• Shipping a B2B back-office application (CRM, inventory manager, content moderation tool) quickly
• Adding a customer-facing self-service portal that needs list/edit/create workflows
• Prototyping data-management UIs before investing in a fully bespoke frontend

Under The Hood

Architecture React Admin is a Lerna/Yarn monorepo of ~17 packages under packages/. ra-core holds all framework logic — data provider contracts, auth provider, routing, store, i18n, controllers — with zero UI dependencies, while ra-ui-materialui layers Material UI components on top and react-admin re-exports both as the batteries-included entry point (packages/react-admin/src/Admin.tsx, Resource.tsx). Data access flows through a single dataProvider interface (get/create/update/delete list & one), decoupling every CRUD screen from the actual backend, which is what lets 45+ community adapters (ra-data-simple-rest, ra-data-graphql, ra-data-fakerest, etc.) plug in interchangeably.

Tech Stack The stack is TypeScript-first (98% of the codebase), built with zshy, and layers React Query (@tanstack/react-query) for server-state caching, react-hook-form for form state, react-router (v6/v7) for navigation, and MUI v5-v7 for components — all declared as peer dependencies so consuming apps control exact versions. ra-core itself stays UI-agnostic, depending only on date-fns, lodash, eventemitter3 and similar utility libs.

Code Quality The repo has substantial test coverage — 139+ .spec.tsx/ts files in ra-core alone, plus Storybook stories and a Cypress e2e suite (cypress/) exercising full demo apps. Naming is consistent (Provider/Controller/View split per feature), and the monorepo uses shared ESLint/TypeScript configs enforced via eslint.config.mjs and tsconfig.json across all packages.

API Design The public API is declarative: <Admin dataProvider={...}><Resource name="posts" list={PostList} .../></Admin> gets a working CRUD app running in a handful of lines, while every internal piece (List, Edit, Datagrid, Field, Input) is a normal React component that can be swapped or composed. Hooks like useGetList/useRecordContext expose the same data underlying the generated UI for custom screens, keeping the escape hatch to full customization consistent with the framework’s own abstractions.