Skip to content

Commit

Permalink
docs: better quick start
Browse files Browse the repository at this point in the history
  • Loading branch information
tannerlinsley committed Jan 30, 2025
1 parent 00446eb commit 044ff1c
Showing 1 changed file with 44 additions and 13 deletions.
57 changes: 44 additions & 13 deletions docs/start/framework/react/quick-start.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,54 @@ id: quick-start
title: Quick Start
---

TanStack Start has load of examples to get you started. Pick one of the examples below to get started!
## Impatient?

If you're impatient, you can clone and run the [Basic](../examples/start-basic) example right away with the following commands:

```bash
npx degit https://github.com/tanstack/router/examples/react/start-basic start-basic
cd start-basic
npm install
npm run dev
```

If you'd like to use a different example, you can replace `start-basic` above with the slug of the example you'd like to use from the list below.

1. Play with each example in the embedded stackblitz preview to find the one that feels like a good starting point
2. Click the **Deploy to Netlify** button to both clone and deploy the example to Netlify
3. Or, manually clone and deploy the example to anywhere else you'd like
4. Once you've done this, head back to the [Learn the Basics](../learn-the-basics) guide to learn how to use TanStack Start
Once you've cloned the example you want, head back to the [Learn the Basics](../learn-the-basics) guide to learn how to use TanStack Start!

## Examples

- [Basic](../examples/start-basic)
- [Basic + Auth](../examples/start-basic-auth)
- [Basic + Counter](../examples/start-basic-counter)
- [Basic + React Query](../examples/start-basic-react-query)
- [Clerk Auth](../examples/start-clerk-basic)
- [Convex + Trellaux](../examples/start-convex-trellaux)
- [Supabase](../examples/start-supabase-basic)
- [Trellaux](../examples/start-trellaux)
TanStack Start has load of examples to get you started. Pick one of the examples below to get started!

- [Basic](../examples/start-basic) (start-basic)
- [Basic + Auth](../examples/start-basic-auth) (start-basic-auth)
- [Basic + Counter](../examples/start-basic-counter) (start-basic-counter)
- [Basic + React Query](../examples/start-basic-react-query) (start-basic-react-query)
- [Clerk Auth](../examples/start-clerk-basic) (start-clerk-basic)
- [Convex + Trellaux](../examples/start-convex-trellaux) (start-convex-trellaux)
- [Supabase](../examples/start-supabase-basic) (start-supabase-basic)
- [Trellaux](../examples/start-trellaux) (start-trellaux)

### Stackblitz

Each example above has an embedded stackblitz preview to find the one that feels like a good starting point

### Quick Deploy

To quickly deploy an example, click the **Deploy to Netlify** button on an example's page to both clone and deploy the example to Netlify.

### Manual Deploy

To manually clone and deploy the example to anywhere else you'd like, use the following commands replacing `EXAMPLE_SLUG` with the slug of the example you'd like to use from above:

```bash
npx degit https://github.com/tanstack/router/examples/react/EXAMPLE_SLUG my-new-project
cd my-new-project
npm install
npm run dev
```

Once you've clone or deployed an example, head back to the [Learn the Basics](../learn-the-basics) guide to learn how to use TanStack Start!

## Other Router Examples

Expand Down

0 comments on commit 044ff1c

Please sign in to comment.