Skip to content

Commit db110c0

Browse files
committed
docs: add TanStack Start docs
1 parent bd7e28f commit db110c0

2 files changed

Lines changed: 45 additions & 0 deletions

File tree

docs/TanStackStart.md

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
---
2+
layout: default
3+
title: "React-admin With TanStack Start"
4+
---
5+
6+
# React-admin With TanStack Start
7+
8+
React-admin supports [TanStack Router](https://tanstack.com/router/latest) as an alternative to react-router. This allows you to use react-admin in a TanStack Start application.
9+
10+
## Installation
11+
12+
Install the TanStack Router adapter and the required router packages:
13+
14+
```bash
15+
npm install react-admin ra-router-tanstack @tanstack/react-router @tanstack/history
16+
# or
17+
yarn add react-admin ra-router-tanstack @tanstack/react-router @tanstack/history
18+
```
19+
20+
## Configuration
21+
22+
Configure `Admin` to use `tanStackRouterProvider`:
23+
24+
```tsx
25+
import { Admin, Resource, ListGuesser } from 'react-admin';
26+
import { tanStackRouterProvider } from 'ra-router-tanstack';
27+
import { dataProvider } from './dataProvider';
28+
29+
const App = () => (
30+
<Admin
31+
dataProvider={dataProvider}
32+
routerProvider={tanStackRouterProvider}
33+
>
34+
<Resource name="posts" list={ListGuesser} />
35+
<Resource name="comments" list={ListGuesser} />
36+
</Admin>
37+
);
38+
39+
export default App;
40+
```
41+
42+
## Next Steps
43+
44+
For standalone vs embedded setups, see the [TanStack Router Integration](./TanStackRouter.md).

docs/navigation.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
<li {% if page.path == 'Remix.md' %} class="active" {% endif %}><a class="nav-link" href="./Remix.html">Remix</a></li>
1717
<li {% if page.path == 'ReactRouterFramework.md' %} class="active" {% endif %}><a class="nav-link" href="./ReactRouterFramework.html">React Router Framework</a></li>
1818
<li {% if page.path == 'Deploy.md' %} class="active beginner" {% endif %}><a class="nav-link" href="./Deploy.html">Deployment</a></li>
19+
<li {% if page.path == 'TanStackStart.md' %} class="active" {% endif %}><a class="nav-link" href="./TanStackStart.html">TanStack Start</a></li>
1920
</ul>
2021

2122
<ul><div>Guides & Concepts</div>

0 commit comments

Comments
 (0)