|
2 | 2 | title: "Getting Started" |
3 | 3 | --- |
4 | 4 |
|
5 | | -Welcome to ra-core, the headless foundation of react-admin! This documentation will guide you through building powerful admin applications using your preferred UI library. |
| 5 | +Welcome to ra-core, the headless single-page application framework for React that helps you build admins panels, internal tools, dashboards, ERPs, and B2B Apps, on top of any REST or GraphQL API. |
6 | 6 |
|
7 | 7 |  |
8 | 8 |
|
9 | 9 | ## What is ra-core? |
10 | 10 |
|
11 | | -Ra-core is the headless version of react-admin - it provides all the business logic, data management, and state handling without being tied to any specific UI library. While react-admin comes with a complete Material UI-based interface, ra-core gives you the freedom to build your admin interface with [Ant Design](https://ant.design/), [Chakra UI](https://chakra-ui.com/), [Daisy UI](https://daisyui.com/), [Shadcn UI](https://ui.shadcn.com/), or any custom UI components. |
| 11 | +Ra-core provides hooks and components to manage the data fetching, data edition, navigation, security, and internationalization logic that you've probably already implemented several times and that form the base of any single-page application. It glues together powerful React libraries like [TanStack Query](https://tanstack.com/query/latest/docs/react/overview), [react-hook-form](https://react-hook-form.com/), and [react-router](https://reactrouter.com/). |
| 12 | + |
| 13 | +Ra-core has a strong emphasis on relational APIs, and lets you aggregate data from several sources directly in the frontend without the need for complex backend logic. |
| 14 | + |
| 15 | +Ra-core is headless, so it gives you the freedom to build your admin interface with [Shadcn UI](https://ui.shadcn.com/), [Material UI](https://mui.com/material-ui/), [Ant Design](https://ant.design/), [Chakra UI](https://chakra-ui.com/), [Daisy UI](https://daisyui.com/), or any custom UI components. |
12 | 16 |
|
13 | 17 | You can use ra-core to: |
14 | 18 | - **Create your own admin app** with your preferred design system |
15 | 19 | - **Build your own admin framework** by adding your own UI layer on top of ra-core's business logic |
16 | 20 |
|
17 | | -Throughout this documentation, we'll use the terms 'ra-core', 'react-admin headless', and 'react-admin' interchangeably when referring to concepts that apply to the headless core functionality. |
| 21 | +## Who Uses ra-core? |
| 22 | + |
| 23 | +Ra-core is the base of two popular admin frameworks: |
| 24 | + |
| 25 | +- **[React-Admin](https://marmelab.com/react-admin/)**: The complete Material UI implementation |
| 26 | +- **[Shadcn Admin Kit](https://marmelab.com/shadcn-admin-kit/)**: A modern implementation using Shadcn UI |
| 27 | + |
| 28 | +These frameworks themselves are used by thousands of developers worldwide. |
| 29 | + |
| 30 | +if you want to see demos of ra-core in action, check out the following resources: |
| 31 | + |
| 32 | +- [Atomic CRM](https://marmelab.com/atomic-crm/), a complete CRM built on top of Supabase |
| 33 | +- [E-commerce backend](https://marmelab.com/shadcn-admin-kit/demo/), a demo built with Shadcn UI and ra-core |
| 34 | +- [HelpDesk ticketing App](https://marmelab.com/react-admin-helpdesk/), a demo built with Material UI |
| 35 | +- [Writer's Delight](https://marmelab.com/writers-delight/), a note-taking app with AI capabilities |
| 36 | +- [Navidrome](https://demo.navidrome.org/app/), a Spotify clone |
| 37 | +- [Kanban](https://djhi.github.io/atomic-pm/#/boards/1), a Kanban board application |
18 | 38 |
|
19 | 39 | ## Why Choose ra-core? |
20 | 40 |
|
@@ -209,14 +229,6 @@ Ra-core provides the foundation; you build the interface. Here's a suggested dev |
209 | 229 |
|
210 | 230 | 8. **Advanced Layouts**: Build tabbed forms, filter panels, breadcrumbs, and responsive designs. Create specialized layouts for different screen sizes, implement advanced form patterns like wizard flows, and enhance navigation with breadcrumbs. |
211 | 231 |
|
212 | | -## Real-World Examples |
213 | | - |
214 | | -See ra-core in action with different UI libraries: |
215 | | - |
216 | | -- **[React-Admin](https://marmelab.com/react-admin/)**: The complete Material UI implementation |
217 | | -- **[Shadcn Admin Kit](https://marmelab.com/shadcn-admin-kit/)**: A modern implementation using Shadcn UI |
218 | | -- **[Tutorial: React-Admin with Daisy UI](https://marmelab.com/blog/2023/11/28/using-react-admin-with-your-favorite-ui-library.html)**: Step-by-step guide using Tailwind CSS, Daisy UI, Tanstack Table, and React-Aria |
219 | | - |
220 | 232 | ## Documentation Structure |
221 | 233 |
|
222 | 234 | This documentation is organized to help you build effectively: |
|
0 commit comments