Minimal Node.js:
import { createTRPCClient, httpBatchLink } from '@trpc/client';
import type { AppRouter } from '../server';
import './polyfill';
const trpc = createTRPCClient<AppRouter>({
links: [
httpBatchLink({
url: 'http://localhost:3000',
}),
],
});
async function main() {
/**
* Inferring types
*/
const users = await trpc.userList.query();
console.log('Users:', users);
const createdUser = await trpc.userCreate.mutate({ name: 'sachinraja' });
console.log('Created user:', createdUser);
const user = await trpc.userById.query('1');
console.log('User 1:', user);
}
main().catch(console.error);
import { createHTTPServer } from '@trpc/server/adapters/standalone';
import { z } from 'zod';
import { db } from './db';
import { publicProcedure, router } from './trpc';
const appRouter = router({
userList: publicProcedure.query(async () => {
// Retrieve users from a datasource, this is an imaginary database
const users = await db.user.findMany();
return users;
}),
userById: publicProcedure.input(z.string()).query(async (opts) => {
const { input } = opts;
// Retrieve the user with the given ID
const user = await db.user.findById(input);
return user;
}),
userCreate: publicProcedure
.input(z.object({ name: z.string() }))
.mutation(async (opts) => {
const { input } = opts;
// Create a new user in the database
const user = await db.user.create(input);
return user;
}),
});
// Export type router type signature,
// NOT the router itself.
export type AppRouter = typeof appRouter;
const server = createHTTPServer({
router: appRouter,
});
server.listen(3000);
| Description | Link |
|---|---|
| tRPC panel automatically generates a UI for manually testing your tRPC backend | https://github.com/iway1/trpc-panel |
| tRPC-OpenAPI - OpenAPI & REST support for your tRPC routers | https://github.com/jlalmes/trpc-openapi |
| tRPC Client Devtools browser extension | https://github.com/rhenriquez28/trpc-client-devtools |
| tRPC Playground - sandbox for testing tRPC queries in the browser | https://github.com/sachinraja/trpc-playground |
| tRPC-Chrome - Web extensions messaging support for tRPC | https://github.com/jlalmes/trpc-chrome |
| Step CI - Automated API Testing and Quality Assurance | https://github.com/stepci/stepci |
| msw-trpc - tRPC support for MSW | https://github.com/maloguertin/msw-trpc |
| Description | Link |
|---|---|
| tRPC-SvelteKit - SvelteKit tRPC extension | https://github.com/icflorescu/trpc-sveltekit |
| tRPC-Remix - Adapter for Remix | https://github.com/ggrandi/trpc-remix |
| tRPC Client For SolidJS W/ Solid Query | https://github.com/OrJDev/solid-trpc |
| tRPC API Handler For SolidStart | https://github.com/OrJDev/solid-start-trpc |
| tRPC-nuxt - Nuxt 3 module | https://github.com/wobsoriano/trpc-nuxt |
| Description | Link |
|---|---|
| create-t3-app - Scaffold a starter project using the T3 Stack (Next.js, tRPC, Tailwind CSS, Prisma) | https://create.t3.gg |
| sidebase - Scaffold a starter project using sidebase (Nuxt 3, tRPC, Tailwind CSS, Prisma) | https://sidebase.io |
| Create JD App - Scaffold a starter project using the JD Stack (SolidStart, tRPC, Tailwind, Prisma) | https://github.com/OrJDev/create-jd-app |
| Create tRPC App - Create tRPC-powered apps with one command | https://github.com/omar-dulaimi/create-trpc-app |
| viteRPC - Monorepo template powered by Vite (Vite, tRPC, Tailwind CSS) | https://github.com/mnik01/viteRPC |
| Description | Link |
|---|---|
| tRPC-uWebSockets - Adapter for uWebSockets.js server | https://github.com/romanzy-1612/trpc-uwebsockets |
| jotai-trpc - Jotai wrapper around tRPC vanilla client | https://github.com/jotai-labs/jotai-trpc |
| @h4ad/serverless-adapter - Connect tRPC with AWS SQS, AWS API Gateway, and many more event sources. | https://viniciusl.com.br/serverless-adapter/docs/main/frameworks/trpc |
| trpc-koa-adapter - tRPC adapter for Koa server | https://github.com/BlairCurrey/trpc-koa-adapter |
| tRPC - iron-session | https://github.com/parkgang/trpc-iron-session |
| electron-trpc - Electron support for tRPC | https://github.com/jsonnull/electron-trpc |
| cloudflare-pages-plugin-trpc - Quickly create a tRPC server with a Cloudflare Pages Function | https://github.com/toyamarinyon/cloudflare-pages-plugin-trpc |
| ZenStack - Full-stack toolkit adds access control to Prisma and generates trpc routers from schema | https://github.com/zenstackhq/zenstack |
| tRPC-SWR - tRPC adapter for Vercel's SWR client | https://trpc-swr.vercel.app/ |
| trpc-rtk-query - Automatically generate RTK Query api endpoints from your tRPC setup | https://github.com/otahontas/trpc-rtk-query |
| k6-trpc - k6 compatible tRPC client | https://github.com/dextertanyj/k6-trpc |
| trpc-token-refresh-link - Link to refresh access tokens and refresh tokens | https://github.com/larskarbo/trpc-token-refresh-link |
| trpc-bun-adapter - tRPC adapter for Bun runtime environment | https://github.com/cah4a/trpc-bun-adapter |
| Description | Link |
|---|---|
| Recommended: Starter project with Prisma, Next.js, tRPC, E2E-testing | https://github.com/trpc/examples-next-prisma-starter |
| create-t3-turbo - Clean and simple starter repo using the T3 Stack along with Expo React Native | http://github.com/t3-oss/create-t3-turbo |
| create-t3-app - Scaffold a starter project using the T3 Stack (Next.js, tRPC, Tailwind CSS, Prisma) | https://create.t3.gg |
| WebSockets Starter Project | https://github.com/trpc/examples-next-prisma-starter-websockets |
| tRPC Kitchen Sink - A collection of tRPC usage patterns. | https://github.com/trpc/examples-kitchen-sink |
| Turborepo + Expo + tRPC Starter | https://github.com/gunnnnii/turbo-expo-trpc-starter |
| tRPC-SvelteKit Example Application | https://github.com/icflorescu/trpc-sveltekit-example |
| tRPC + Ultra | https://github.com/sachinraja/trpc-ultra |
| Nx Monorepo + tRPC + Prisma | https://github.com/nowlena/nx-trpc-test |
| tRPC (w/ Fetch Adapter) + SvelteKit + Tailwind CSS | https://github.com/austins/trpc-sveltekit-fetchadapter-example |
| Sign-In With Ethereum tRPC + ViteJS React | https://github.com/codingwithmanny/trpc-siwe-monorepo |
| tRPC + Vue3 todo example project (tRPC, Express.js, Vue3, Prisma, vue-query) | https://github.com/guushamann/Todo-tRPC-Vue3 |
| Vite + Svelte + tRPC | https://github.com/mishankov/vite-svelte-trpc |
| V3 - A T3 Inspired Nuxt Stack | https://github.com/CRBroughton/V3 |
| sidebase - Scaffold a starter project using sidebase (Nuxt 3, tRPC, Tailwind CSS, Prisma) | https://sidebase.io |
| Twitter clone - A simple Twitter clone built with T3 Stack + NextAuth + Supabase + Prisma | https://github.com/AlandSleman/t3-twitter-clone |
| Separate backend & frontend repositories | https://github.com/mkosir/trpc-api-boilerplate |
| tRPC + Deno + fresh | https://github.com/LunaTK/fresh-trpc-example |
| Description | Link |
|---|---|
| Cal.com - Scheduling infrastructure | https://github.com/calcom/cal.com |
| Skill Recordings - Hosting courses by Matt Pocock, Kent C Dodds, Dan Abramov, and many others | https://github.com/skillrecordings/products |
| SST - A framework that makes it easy to build serverless apps. | https://github.com/serverless-stack/sst |
| Beam - A simple message board for your organization or project. | https://github.com/planetscale/beam |
| Rallly - Self-hostable doodle poll alternative. | https://github.com/lukevella/rallly |
| Hilde - Match-making app for games like foosball, air hockey and similar | https://github.com/nehalist/hilde |
| Answer Overflow - Discord bot that indexes help channel content into Google | https://github.com/AnswerOverflow/AnswerOverflow |
| Prisma Editor - Powerful tool to visualize and edit Prisma Schema | https://github.com/mohammed-bahumaish/prisma-editor |
| Saleor Apps - Official apps/integrations for Saleor Commerce | https://github.com/saleor/apps |
| Rao Pics App - Visit Photo on any device. Supported MacOS/Windows | https://github.com/rao-pics/rao-pics |
Last modified 13 January 2024