Playgrounds
Explore oRPC implementations through our interactive playgrounds, featuring pre-configured examples accessible instantly via StackBlitz or local setup.
Available Playgrounds
| Environment | StackBlitz | GitHub Source |
|---|---|---|
| Next.js Playground | Open in StackBlitz | View Source |
| TanStack Start Playground | Open in StackBlitz | View Source |
| Nuxt.js Playground | Open in StackBlitz | View Source |
| Solid Start Playground | Open in StackBlitz | View Source |
| Svelte Kit Playground | Open in StackBlitz | View Source |
| Astro Playground | Open in StackBlitz | View Source |
| Contract-First Playground | Open in StackBlitz | View Source |
| NestJS Playground | Open in StackBlitz | View Source |
| Cloudflare Worker | Open in StackBlitz | View Source |
| Bun WebSocket + OpenTelemetry | View Source | |
| Electron Playground | View Source | |
| Browser Extension Playground | View Source |
WARNING
StackBlitz has own limitations, so some features may not work as expected.
Local Development
If you prefer working locally, you can clone any playground using the following commands:
bash
npx degit unnoq/orpc/playgrounds/next orpc-next-playground
npx degit unnoq/orpc/playgrounds/tanstack-start orpc-tanstack-start-playground
npx degit unnoq/orpc/playgrounds/nuxt orpc-nuxt-playground
npx degit unnoq/orpc/playgrounds/solid-start orpc-solid-start-playground
npx degit unnoq/orpc/playgrounds/svelte-kit orpc-svelte-kit-playground
npx degit unnoq/orpc/playgrounds/astro orpc-astro-playground
npx degit unnoq/orpc/playgrounds/contract-first orpc-contract-first-playground
npx degit unnoq/orpc/playgrounds/nest orpc-nest-playground
npx degit unnoq/orpc/playgrounds/cloudflare-worker orpc-cloudflare-worker-playground
npx degit unnoq/orpc/playgrounds/bun-websocket-otel orpc-bun-websocket-otel-playground
npx degit unnoq/orpc/playgrounds/electron orpc-electron-playground
npx degit unnoq/orpc/playgrounds/browser-extension orpc-browser-extension-playgroundFor each project, set up the development environment:
bash
# Install dependencies
npm install
# Start the development server
npm run devThat's it! You can now access the playground at http://localhost:3000.
