Playground

Interactive development environments for exploring and testing oRPC functionality.

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
Nuxt.js Playground	Open in StackBlitz	View Source
OpenAPI Playground	Open in StackBlitz	View Source
OpenAPI with Contract Playground	Open in StackBlitz	View Source
Express.js Playground	Open in StackBlitz	View Source

Note 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:

# Clone specific playground environments
npx degit unnoq/orpc/playgrounds/nextjs orpc-nextjs-playground
npx degit unnoq/orpc/playgrounds/nuxt orpc-nuxt-playground
npx degit unnoq/orpc/playgrounds/openapi orpc-openapi-playground
npx degit unnoq/orpc/playgrounds/contract-openapi orpc-contract-openapi-playground
npx degit unnoq/orpc/playgrounds/expressjs orpc-expressjs-playground

For each project, set up the development environment:

# Install dependencies
npm install
 
# Start the development server
npm run dev

That's it! You can now access the playground at http://localhost:3000.

Available Playgrounds

Local Development

On this page