You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Modernize README to be more aligned with other TanStack READMEs (#669)
* Modernize README to be more aligned with other tanstack READMEs
* Improve header hierarchy
---------
Co-authored-by: Sarah Gerrard <gerrardsarah@gmail.com>
The home of the TanStack ecosystem. Built with [TanStack Router](https://tanstack.com/router) and deployed automagically with [Netlify](https://netlify.com/).
### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)
10
+
11
+
</div>
10
12
11
13
## Development
12
14
15
+
### Quick Start
16
+
13
17
From your terminal:
14
18
15
19
```sh
@@ -19,76 +23,66 @@ pnpm dev
19
23
20
24
This starts your app in development mode, rebuilding assets on file changes.
21
25
22
-
##Authentication in Development
26
+
### Local Setup
23
27
24
-
The dev server uses the production database and real OAuth, so dev and production behave identically. To authenticate your local session, run:
28
+
The documentation for all TanStack projects (except `React Charts`) is hosted on [tanstack.com](https://tanstack.com). In production, doc pages are fetched from GitHub. In development, they're read from your local file system.
25
29
26
-
```sh
27
-
pnpm auth:login
28
-
```
30
+
Pre-commit hooks run smoke tests against these docs, so you'll need sibling repos cloned for commits to pass.
29
31
30
-
This opens `tanstack.com` in your browser. Sign in with GitHub or Google, and the resulting session token is saved to `.env.local` as `DEV_SESSION_TOKEN`. Restart the dev server and you will be signed in automatically.
31
-
32
-
To authenticate against a locally running server instead:
32
+
Create a `tanstack` parent directory and clone this repo alongside the projects:
> The token is a real signed session cookie tied to your production account. It expires in 30 days. Re-run `pnpm auth:login` to refresh it.
40
-
41
-
> [!NOTE]
42
-
> If you are using an AI agent (Claude, Cursor, etc.) to help develop, run `pnpm auth:login` once before starting your session so the agent can interact with authenticated features on your behalf.
43
-
44
-
## Editing and previewing the docs of TanStack projects locally
45
-
46
-
The documentations for all TanStack projects except for `React Charts` are hosted on [https://tanstack.com](https://tanstack.com), powered by this TanStack Router app.
47
-
In production, the markdown doc pages are fetched from the GitHub repos of the projects, but in development they are read from the local file system.
48
-
49
-
Follow these steps if you want to edit the doc pages of a project (in these steps we'll assume it's [`TanStack/form`](https://github.com/tanstack/form)) and preview them locally :
50
-
51
-
1. Create a new directory called `tanstack`.
42
+
Your directory structure should look like this:
52
43
53
-
```sh
54
-
mkdir tanstack
44
+
```
45
+
tanstack/
46
+
├── tanstack.com/
47
+
├── query/
48
+
├── router/
49
+
└── table/
55
50
```
56
51
57
-
2. Enter the directory and clone this repo and the repo of the project there.
52
+
> [!WARNING]
53
+
> Directory names must match repo names exactly (e.g., `query` not `tanstack-query`). The app finds docs by looking for sibling directories by name.
To edit docs for a project, make changes in its `docs/` folder (e.g., `../form/docs/`) and visit http://localhost:3000/form/latest/docs/overview to preview.
64
58
65
59
> [!NOTE]
66
-
> Your `tanstack` directory should look like this:
67
-
>
68
-
> ```
69
-
> tanstack/
70
-
> |
71
-
> +-- form/
72
-
> |
73
-
> +-- tanstack.com/
74
-
> ```
60
+
> Updated pages need to be manually reloaded in the browser.
75
61
76
62
> [!WARNING]
77
-
> Make sure the name of the directory in your local file system matches the name of the project's repo. For example, `tanstack/form` must be cloned into `form` (this is the default) instead of `some-other-name`, because that way, the doc pages won't be found.
63
+
> Update the project's `docs/config.json` if you add a new doc page!
78
64
79
-
3. Enter the `tanstack/tanstack.com` directory, install the dependencies and run the app in dev mode:
65
+
## Get Involved
80
66
81
-
```sh
82
-
cd tanstack.com
83
-
pnpm i
84
-
# The app will run on https://localhost:3000 by default
85
-
pnpm dev
86
-
```
67
+
- We welcome issues and pull requests!
68
+
- Participate in [GitHub Discussions](https://github.com/TanStack/tanstack.com/discussions)
69
+
- Chat with the community on [Discord](https://discord.com/invite/WrRKjPJ)
87
70
88
-
4. Now you can visit http://localhost:3000/form/latest/docs/overview in the browser and see the changes you make in `tanstack/form/docs`.
71
+
## Explore the TanStack Ecosystem
89
72
90
-
> [!NOTE]
91
-
> The updated pages need to be manually reloaded in the browser.
73
+
- <ahref="https://github.com/tanstack/config"><b>TanStack Config</b></a> – Tooling for JS/TS packages
74
+
- <ahref="https://github.com/tanstack/db"><b>TanStack DB</b></a> – Reactive sync client store
0 commit comments