Skip to content

Commit e98b833

Browse files
authored
docs: solid start playground (#228)
<!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Launched the new "Solid Start Playground" with interactive experiences such as planet creation and listing, enhanced data querying, and real-time UI interactions. - **Documentation** - Expanded documentation to include the "Solid Start Playground" with links for online access and local setup instructions, streamlining the process to explore and experiment with Solid.js applications. - Corrected the export statement for the PATCH method in the SolidStart integration documentation to align with standard naming conventions. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
1 parent 9b9ade5 commit e98b833

34 files changed

+1986
-1
lines changed

apps/content/docs/integrations/solid-start.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ async function handle({ request }: APIEvent) {
2929
export const GET = handle
3030
export const POST = handle
3131
export const PUT = handle
32-
export const PATCh = handle
32+
export const PATCH = handle
3333
export const DELETE = handle
3434
```
3535

apps/content/docs/playgrounds.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ featuring pre-configured examples accessible instantly via StackBlitz or local s
1717
| OpenAPI Playground | [Open in StackBlitz](https://stackblitz.com/github/unnoq/orpc/tree/main/playgrounds/openapi?file=src%2Frouter%2Findex.ts) | [View Source](https://github.com/unnoq/orpc/tree/main/playgrounds/openapi/src/router/index.ts) |
1818
| OpenAPI with Contract Playground | [Open in StackBlitz](https://stackblitz.com/github/unnoq/orpc/tree/main/playgrounds/contract-openapi?file=src%2Frouter%2Findex.ts) | [View Source](https://github.com/unnoq/orpc/tree/main/playgrounds/contract-openapi/src/router/index.ts) |
1919
| Express.js Playground | [Open in StackBlitz](https://stackblitz.com/github/unnoq/orpc/tree/main/playgrounds/expressjs?file=src%2Frouter%2Findex.ts) | [View Source](https://github.com/unnoq/orpc/tree/main/playgrounds/expressjs/src/router/index.ts) |
20+
| Solid Start Playground | [Open in StackBlitz](https://stackblitz.com/github/unnoq/orpc/tree/main/playgrounds/solid-start?file=src%2Frouter%2Findex.ts) | [View Source](https://github.com/unnoq/orpc/tree/main/playgrounds/solid-start/src/router/index.ts) |
2021

2122
:::warning
2223
StackBlitz has own limitations, so some features may not work as expected.
@@ -33,6 +34,7 @@ npx degit unnoq/orpc/playgrounds/nuxt orpc-nuxt-playground
3334
npx degit unnoq/orpc/playgrounds/openapi orpc-openapi-playground
3435
npx degit unnoq/orpc/playgrounds/contract-openapi orpc-contract-openapi-playground
3536
npx degit unnoq/orpc/playgrounds/expressjs orpc-expressjs-playground
37+
npx degit unnoq/orpc/playgrounds/solid-start orpc-solid-start-playground
3638
```
3739

3840
For each project, set up the development environment:

playgrounds/solid-start/.gitignore

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
dist
2+
.solid
3+
.output
4+
.vercel
5+
.netlify
6+
.vinxi
7+
app.config.timestamp_*.js
8+
9+
# Environment
10+
.env
11+
.env*.local
12+
13+
# dependencies
14+
/node_modules
15+
16+
# IDEs and editors
17+
/.idea
18+
.project
19+
.classpath
20+
*.launch
21+
.settings/
22+
23+
# Temp
24+
gitignore
25+
26+
# System Files
27+
.DS_Store
28+
Thumbs.db

playgrounds/solid-start/README.md

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
# SolidStart
2+
3+
Everything you need to build a Solid project, powered by [`solid-start`](https://start.solidjs.com);
4+
5+
## Creating a project
6+
7+
```bash
8+
# create a new project in the current directory
9+
npm init solid@latest
10+
11+
# create a new project in my-app
12+
npm init solid@latest my-app
13+
```
14+
15+
## Developing
16+
17+
Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server:
18+
19+
```bash
20+
npm run dev
21+
22+
# or start the server and open the app in a new browser tab
23+
npm run dev -- --open
24+
```
25+
26+
## Building
27+
28+
Solid apps are built with _presets_, which optimise your project for deployment to different environments.
29+
30+
By default, `npm run build` will generate a Node app that you can run with `npm start`. To use a different preset, add it to the `devDependencies` in `package.json` and specify in your `app.config.js`.
31+
32+
## This project was created with the [Solid CLI](https://solid-cli.netlify.app)
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { defineConfig } from '@solidjs/start/config'
2+
3+
export default defineConfig({})
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"name": "orpc-solid-start-playground",
3+
"type": "module",
4+
"scripts": {
5+
"dev": "vinxi dev",
6+
"build": "vinxi build",
7+
"start": "vinxi start"
8+
},
9+
"dependencies": {
10+
"@orpc/client": "next",
11+
"@orpc/openapi": "next",
12+
"@orpc/server": "next",
13+
"@orpc/solid-query": "next",
14+
"@orpc/zod": "next",
15+
"@solidjs/start": "^1.1.0",
16+
"@tanstack/solid-query": "^5.66.4",
17+
"solid-js": "^1.9.5",
18+
"vinxi": "^0.5.3"
19+
}
20+
}
664 Bytes
Binary file not shown.
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import { QueryClient, QueryClientProvider } from '@tanstack/solid-query'
2+
import { CreatePlanetMutationForm } from './orpc-mutation'
3+
import { ListPlanetsQuery } from './orpc-query'
4+
5+
const queryClient = new QueryClient()
6+
7+
export default function App() {
8+
return (
9+
<QueryClientProvider client={queryClient}>
10+
<div>
11+
<h1>ORPC Playground</h1>
12+
<p>
13+
You can visit the
14+
{' '}
15+
<a href="/scalar">Scalar API Reference</a>
16+
{' '}
17+
page.
18+
</p>
19+
<hr />
20+
<CreatePlanetMutationForm />
21+
<hr />
22+
<ListPlanetsQuery />
23+
</div>
24+
</QueryClientProvider>
25+
)
26+
}
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import type { z } from 'zod'
2+
import type { PlanetSchema } from '../schemas/planet'
3+
4+
export const planets: z.infer<typeof PlanetSchema>[] = [
5+
{
6+
id: 1,
7+
name: 'Earth',
8+
description: 'The planet Earth',
9+
imageUrl: 'https://picsum.photos/200/300',
10+
creator: {
11+
id: '1',
12+
name: 'John Doe',
13+
email: 'john@doe.com',
14+
},
15+
},
16+
{
17+
id: 2,
18+
name: 'Mars',
19+
description: 'The planet Mars',
20+
imageUrl: 'https://picsum.photos/200/300',
21+
creator: {
22+
id: '1',
23+
name: 'John Doe',
24+
email: 'john@doe.com',
25+
},
26+
},
27+
{
28+
id: 3,
29+
name: 'Jupiter',
30+
description: 'The planet Jupiter',
31+
imageUrl: 'https://picsum.photos/200/300',
32+
creator: {
33+
id: '1',
34+
name: 'John Doe',
35+
email: 'john@doe.com',
36+
},
37+
},
38+
]
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
// @refresh reload
2+
import { mount, StartClient } from '@solidjs/start/client'
3+
4+
mount(() => <StartClient />, document.getElementById('app')!)

0 commit comments

Comments
 (0)