Skip to main content
Version: 10.x

Define Procedures

tip
  • A procedure can be viewed as the equivalent of a REST-endpoint or a function.
  • There's no internal difference between queries and mutations apart from semantics.
  • Defining procedure is the same for queries, mutations, and subscription with the exception that subscriptions need to return an observable instance.

Example without input validation

ts
import { t } from './trpc';
import { z } from 'zod';
 
const appRouter = t.router({
// Create procedure at path 'hello'
hello: t.procedure.query(() => {
return {
greeting: 'hello world',
};
}),
});
 
ts
import { t } from './trpc';
import { z } from 'zod';
 
const appRouter = t.router({
// Create procedure at path 'hello'
hello: t.procedure.query(() => {
return {
greeting: 'hello world',
};
}),
});
 

Input validation

tRPC works out-of-the-box with yup/superstruct/zod/myzod/custom validators/[..] - see test suite

With Zod

ts
import { t } from './trpc';
import { z } from 'zod';
 
export const appRouter = t.router({
hello: t.procedure
.input(
z
.object({
text: z.string(),
})
.optional(),
)
.query(({ input }) => {
(parameter) input: { text: string; } | undefined
return {
greeting: `hello ${input?.text ?? 'world'}`,
};
}),
});
 
export type AppRouter = typeof appRouter;
ts
import { t } from './trpc';
import { z } from 'zod';
 
export const appRouter = t.router({
hello: t.procedure
.input(
z
.object({
text: z.string(),
})
.optional(),
)
.query(({ input }) => {
(parameter) input: { text: string; } | undefined
return {
greeting: `hello ${input?.text ?? 'world'}`,
};
}),
});
 
export type AppRouter = typeof appRouter;

With Yup

tsx
import { initTRPC } from '@trpc/server';
import * as yup from 'yup';
export const t = initTRPC.create();
export const appRouter = t.router({
hello: t.procedure
.input(
yup.object({
text: yup.string().required(),
}),
)
.query(({ input }) => {
return {
greeting: `hello ${input?.text ?? 'world'}`,
};
}),
});
export type AppRouter = typeof appRouter;
tsx
import { initTRPC } from '@trpc/server';
import * as yup from 'yup';
export const t = initTRPC.create();
export const appRouter = t.router({
hello: t.procedure
.input(
yup.object({
text: yup.string().required(),
}),
)
.query(({ input }) => {
return {
greeting: `hello ${input?.text ?? 'world'}`,
};
}),
});
export type AppRouter = typeof appRouter;

With Superstruct

tsx
import { initTRPC } from '@trpc/server';
import { defaulted, object, string } from 'superstruct';
export const t = initTRPC.create();
export const appRouter = t.router({
hello: t.procedure
.input(
object({
/**
* Also supports inline doc strings when referencing the type.
*/
text: defaulted(string(), 'world'),
}),
)
.query(({ input }) => {
return {
greeting: `hello ${input.text}`,
};
}),
});
export type AppRouter = typeof appRouter;
tsx
import { initTRPC } from '@trpc/server';
import { defaulted, object, string } from 'superstruct';
export const t = initTRPC.create();
export const appRouter = t.router({
hello: t.procedure
.input(
object({
/**
* Also supports inline doc strings when referencing the type.
*/
text: defaulted(string(), 'world'),
}),
)
.query(({ input }) => {
return {
greeting: `hello ${input.text}`,
};
}),
});
export type AppRouter = typeof appRouter;

Multiple input parsers

You're able to chain multiple parsers in order to make reusable procedures for different parts of your application.

server.ts
ts
import { t } from './trpc';
import { z } from 'zod';
 
// Create reusable procedure for a chat room
const roomProcedure = t.procedure.input(
z.object({
roomId: z.string(),
}),
);
 
const appRouter = t.router({
sendMessage: roomProcedure
// Add extra input validation for the `sendMessage`-procedure
.input(
z.object({
text: z.string(),
}),
)
.mutation(({ input }) => {
(parameter) input: { roomId: string; text: string; }
// [...]
}),
});
 
export type AppRouter = typeof appRouter;
server.ts
ts
import { t } from './trpc';
import { z } from 'zod';
 
// Create reusable procedure for a chat room
const roomProcedure = t.procedure.input(
z.object({
roomId: z.string(),
}),
);
 
const appRouter = t.router({
sendMessage: roomProcedure
// Add extra input validation for the `sendMessage`-procedure
.input(
z.object({
text: z.string(),
}),
)
.mutation(({ input }) => {
(parameter) input: { roomId: string; text: string; }
// [...]
}),
});
 
export type AppRouter = typeof appRouter;

Multiple Procedures

To add multiple procedures, you define them as properties on the object passed to t.router().

tsx
import { initTRPC } from '@trpc/server';
export const t = initTRPC.create();
export const appRouter = t.router({
hello: t.procedure.query(() => {
return {
text: 'hello world',
};
}),
bye: t.procedure.query(() => {
return {
text: 'goodbye',
};
}),
});
export type AppRouter = typeof appRouter;
tsx
import { initTRPC } from '@trpc/server';
export const t = initTRPC.create();
export const appRouter = t.router({
hello: t.procedure.query(() => {
return {
text: 'hello world',
};
}),
bye: t.procedure.query(() => {
return {
text: 'goodbye',
};
}),
});
export type AppRouter = typeof appRouter;