Express.js 사용 방법

비공식 베타 번역

이 페이지는 PageTurner AI로 번역되었습니다(베타). 프로젝트 공식 승인을 받지 않았습니다. 오류를 발견하셨나요? 문제 신고 →

예시 애플리케이션

Description	URL	Links
Express server & procedure calls with node.js.	n/a	CodeSandbox Source

기존 Express.js 프로젝트에 tRPC 추가하기

1. 의존성 설치

bash
yarn add @trpc/server zod

bash
yarn add @trpc/server zod

Zod는 필수 의존성이 아니지만, 아래 샘플 라우터에서 사용됩니다.

2. tRPC 라우터 생성

tRPC 라우터를 구현하세요. 아래는 샘플 라우터입니다:

server.ts
ts
import * as trpc from '@trpc/server';
import { z } from 'zod';
const appRouter = trpc
  .router()
  .query('getUser', {
    input: z.string(),
    async resolve(req) {
      req.input; // string
      return { id: req.input, name: 'Bilbo' };
    },
  })
  .mutation('createUser', {
    // validate input with Zod
    input: z.object({ name: z.string().min(5) }),
    async resolve(req) {
      // use your ORM of choice
      return await UserModel.create({
        data: req.input,
      });
    },
  });
// export type definition of API
export type AppRouter = typeof appRouter;

server.ts
ts
import * as trpc from '@trpc/server';
import { z } from 'zod';
const appRouter = trpc
  .router()
  .query('getUser', {
    input: z.string(),
    async resolve(req) {
      req.input; // string
      return { id: req.input, name: 'Bilbo' };
    },
  })
  .mutation('createUser', {
    // validate input with Zod
    input: z.object({ name: z.string().min(5) }),
    async resolve(req) {
      // use your ORM of choice
      return await UserModel.create({
        data: req.input,
      });
    },
  });
// export type definition of API
export type AppRouter = typeof appRouter;

라우터 파일이 너무 커지기 시작하면 라우터를 여러 개의 서브라우터로 분할하고 각각 별도 파일로 구현하세요. 그런 다음 이들을 병합하여 단일 루트 appRouter로 만드세요.

3. Express.js 어댑터 사용하기

tRPC는 Express.js 어댑터를 기본 제공합니다. 이 어댑터를 사용하면 tRPC 라우터를 Express.js 미들웨어로 변환할 수 있습니다.

server.ts
ts
import * as trpcExpress from '@trpc/server/adapters/express';
const appRouter = /* ... */;
const app = express();
// created for each request
const createContext = ({
  req,
  res,
}: trpcExpress.CreateExpressContextOptions) => ({}) // no context
type Context = trpc.inferAsyncReturnType<typeof createContext>;
app.use(
  '/trpc',
  trpcExpress.createExpressMiddleware({
    router: appRouter,
    createContext,
  })
);
app.listen(4000);

server.ts
ts
import * as trpcExpress from '@trpc/server/adapters/express';
const appRouter = /* ... */;
const app = express();
// created for each request
const createContext = ({
  req,
  res,
}: trpcExpress.CreateExpressContextOptions) => ({}) // no context
type Context = trpc.inferAsyncReturnType<typeof createContext>;
app.use(
  '/trpc',
  trpcExpress.createExpressMiddleware({
    router: appRouter,
    createContext,
  })
);
app.listen(4000);

이제 엔드포인트를 HTTP를 통해 사용할 수 있습니다!

Endpoint	HTTP URI
getUser	GET http://localhost:4000/trpc/getUser?input=INPUT where INPUT is a URI-encoded JSON string.
createUser	POST http://localhost:4000/trpc/createUser with req.body of type {name: string}