tRPC 초기 설정

package.json

@@ -21,8 +21,9 @@
     "@sveltejs/adapter-node": "^5.4.0",
     "@sveltejs/kit": "^2.48.4",
     "@sveltejs/vite-plugin-svelte": "^6.2.1",
+    "@trpc/client": "^11.7.1",
     "@types/file-saver": "^2.0.7",
-    "@types/ms": "^2.1.0",
+    "@types/ms": "^0.7.34",
     "@types/node-schedule": "^2.1.8",
     "@types/pg": "^8.15.6",
     "autoprefixer": "^10.4.21",
@@ -53,6 +54,7 @@
   },
   "dependencies": {
     "@fastify/busboy": "^3.2.0",
+    "@trpc/server": "^11.7.1",
     "argon2": "^0.44.0",
     "kysely": "^0.28.8",
     "ms": "^2.1.3",

pnpm-lock.yaml

@@ -11,6 +11,9 @@ importers:
       '@fastify/busboy':
         specifier: ^3.2.0
         version: 3.2.0
+      '@trpc/server':
+        specifier: ^11.7.1
+        version: 11.7.1(typescript@5.9.3)
       argon2:
         specifier: ^0.44.0
         version: 0.44.0
@@ -48,12 +51,15 @@ importers:
       '@sveltejs/vite-plugin-svelte':
         specifier: ^6.2.1
         version: 6.2.1(svelte@5.43.2)(vite@7.1.12(@types/node@24.9.2)(jiti@1.21.7)(yaml@2.8.0))
+      '@trpc/client':
+        specifier: ^11.7.1
+        version: 11.7.1(@trpc/server@11.7.1(typescript@5.9.3))(typescript@5.9.3)
       '@types/file-saver':
         specifier: ^2.0.7
         version: 2.0.7
       '@types/ms':
-        specifier: ^2.1.0
-        version: 2.1.0
+        specifier: ^0.7.34
+        version: 0.7.34
       '@types/node-schedule':
         specifier: ^2.1.8
         version: 2.1.8
@@ -612,6 +618,17 @@ packages:
       svelte: ^5.0.0
       vite: ^6.3.0 || ^7.0.0
 
+  '@trpc/client@11.7.1':
+    resolution: {integrity: sha512-uOnAjElKI892/U6aQMcBHYs3x7mme3Cvv1F87ytBL56rBvs7+DyK7r43zgaXKf13+GtPEI6ex5xjVUfyDW8XcQ==}
+    peerDependencies:
+      '@trpc/server': 11.7.1
+      typescript: '>=5.7.2'
+
+  '@trpc/server@11.7.1':
+    resolution: {integrity: sha512-N3U8LNLIP4g9C7LJ/sLkjuPHwqlvE3bnspzC4DEFVdvx2+usbn70P80E3wj5cjOTLhmhRiwJCSXhlB+MHfGeCw==}
+    peerDependencies:
+      typescript: '>=5.7.2'
+
   '@types/cookie@0.6.0':
     resolution: {integrity: sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==}
 
@@ -624,8 +641,8 @@ packages:
   '@types/json-schema@7.0.15':
     resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
 
-  '@types/ms@2.1.0':
-    resolution: {integrity: sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==}
+  '@types/ms@0.7.34':
+    resolution: {integrity: sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g==}
 
   '@types/node-schedule@2.1.8':
     resolution: {integrity: sha512-k00g6Yj/oUg/CDC+MeLHUzu0+OFxWbIqrFfDiLi6OPKxTujvpv29mHGM8GtKr7B+9Vv92FcK/8mRqi1DK5f3hA==}
@@ -2450,6 +2467,15 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@trpc/client@11.7.1(@trpc/server@11.7.1(typescript@5.9.3))(typescript@5.9.3)':
+    dependencies:
+      '@trpc/server': 11.7.1(typescript@5.9.3)
+      typescript: 5.9.3
+
+  '@trpc/server@11.7.1(typescript@5.9.3)':
+    dependencies:
+      typescript: 5.9.3
+
   '@types/cookie@0.6.0': {}
 
   '@types/estree@1.0.8': {}
@@ -2458,7 +2484,7 @@ snapshots:
 
   '@types/json-schema@7.0.15': {}
 
-  '@types/ms@2.1.0': {}
+  '@types/ms@0.7.34': {}
 
   '@types/node-schedule@2.1.8':
     dependencies:

src/routes/trpc/[...trpc]/+server.ts

@@ -0,0 +1,15 @@
+import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
+import { createContext } from "$trpc/init.server";
+import { appRouter } from "$trpc/router.server";
+import type { RequestHandler } from "./$types";
+
+const trpcHandler: RequestHandler = (event) =>
+  fetchRequestHandler({
+    endpoint: "/trpc",
+    req: event.request,
+    router: appRouter,
+    createContext: () => createContext(event),
+  });
+
+export const GET = trpcHandler;
+export const POST = trpcHandler;

src/trpc/client.ts

@@ -0,0 +1,23 @@
+import { createTRPCClient, httpBatchLink } from "@trpc/client";
+import { browser } from "$app/environment";
+import type { AppRouter } from "./router.server";
+
+const createClient = (fetch: typeof globalThis.fetch) =>
+  createTRPCClient<AppRouter>({
+    links: [
+      httpBatchLink({
+        url: "/trpc",
+        fetch,
+      }),
+    ],
+  });
+
+let browserClient: ReturnType<typeof createClient>;
+
+export const trpc = (fetch = globalThis.fetch) => {
+  const client = browserClient ?? createClient(fetch);
+  if (browser) {
+    browserClient ??= client;
+  }
+  return client;
+};

src/trpc/init.server.ts

@@ -0,0 +1,9 @@
+import type { RequestEvent } from "@sveltejs/kit";
+import { initTRPC } from "@trpc/server";
+
+export const createContext = (event: RequestEvent) => event;
+
+const t = initTRPC.context<Awaited<ReturnType<typeof createContext>>>().create();
+
+export const router = t.router;
+export const publicProcedure = t.procedure;

src/trpc/router.server.ts

@@ -0,0 +1,13 @@
+import type { RequestEvent } from "@sveltejs/kit";
+import type { inferRouterInputs, inferRouterOutputs } from "@trpc/server";
+import { createContext, router } from "./init.server";
+
+export const appRouter = router({
+  // TODO
+});
+
+export const createCaller = (event: RequestEvent) => appRouter.createCaller(createContext(event));
+
+export type AppRouter = typeof appRouter;
+export type RouterInputs = inferRouterInputs<AppRouter>;
+export type RouterOutputs = inferRouterOutputs<AppRouter>;

svelte.config.js

@@ -3,15 +3,12 @@ import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
-  // Consult https://svelte.dev/docs/kit/integrations
-  // for more information about preprocessors
   preprocess: vitePreprocess(),
-
   kit: {
-    // adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
-    // If your environment is not supported, or you settled on a specific environment, switch out the adapter.
-    // See https://svelte.dev/docs/kit/adapters for more information about adapters.
     adapter: adapter(),
+    alias: {
+      $trpc: "./src/trpc",
+    },
   },
 };