Översikt över typsäker tRPC-klient
Se hur tRPC uppnår typsäkerhet från klient till server
Översikt över typsäker tRPC-klient är en gratis lektion i TypeScript Academy på CoddyKit. Detta är lektion 4 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för TypeScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i TypeScript Academy innehåller totalt 4 lektioner.
Välkommen
Vad är tRPC
Definition av server-router
import { initTRPC } from '@trpc/server';
const t = initTRPC.create();
const appRouter = t.router({
getUser: t.procedure.input(z.number()).query(({ input }) => db.getUser(input)),
});Typinferens
export type AppRouter = typeof appRouter;Klientkonfiguration
import { createTRPCProxyClient, httpBatchLink } from '@trpc/client';
const trpc = createTRPCProxyClient<AppRouter>({
links: [httpBatchLink({ url: '/api/trpc' })],
});Typade klientanrop
const user = await trpc.getUser.query(1);
// user is typed as the return type of getUserIndatavalidering med Zod
t.procedure.input(z.object({ name: z.string(), email: z.string().email() })).mutation(...)Mutationer
const router = t.router({
createUser: t.procedure.input(CreateUserSchema).mutation(({ input }) => db.create(input)),
});Integrering med React Query
const { data: user } = trpc.getUser.useQuery(1);
// data is typed automaticallyFelhantering i tRPC
import { TRPCError } from '@trpc/server';
if (!user) throw new TRPCError({ code: 'NOT_FOUND', message: 'User not found' });tRPC jämfört med REST och GraphQL
Snabbtest
Sammanfattning
Lär dig TypeScript med en AI-lärare – gratis
Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.
- Kurser
- 101
- Lektioner
- 352
Vanliga frågor
Är lektionen ”Översikt över typsäker tRPC-klient” gratis?
Ja – hela texten till ”Översikt över typsäker tRPC-klient” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i TypeScript Academy, kan Ni uppgradera till CoddyKit PRO. Kursen i TypeScript Academy innehåller totalt 4 lektioner.
Vad lär jag mig i ”Översikt över typsäker tRPC-klient”?
Se hur tRPC uppnår typsäkerhet från klient till server Ni övar på TypeScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.
Behöver jag någon erfarenhet för att börja lära mig TypeScript Academy?
Du behöver inga förkunskaper. Utbildningen i TypeScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 4 av 4.
Hur lång tid tar lektionen ”Översikt över typsäker tRPC-klient”?
De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.
Kan jag skriva och köra kod i den här TypeScript Academy-lektionen?
Ja. Varje TypeScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.
Alla lektioner i den här kursen
- Typa fetch-svar med generiska wrappers
- Validering vid körning med Zod
- OpenAPI-kodgenerering: automatiskt genererade typer
- Översikt över typsäker tRPC-klient