📋 محتويات الصفحة
📖 الوصف
tRPC هو framework لبناء APIs مع type safety كامل من الخادم إلى الواجهة (end-to-end typesafety) بدون الحاجة لتعريف schemas منفصلة أو توليد كود. يستخدم TypeScript type inference لنقل تعريفات الأنواع تلقائياً من الـ Backend إلى الـ Frontend. مع tRPC، عندما تغيّر نوعاً في الـ Backend، يُحدّث تلقائياً ف...
🎯 يستخدم في
مجالات استخدام هذه الأداة
بناء APIs بسرعة مع type safety كامل
تطبيقات full-stack بـ TypeScript
Next.js مع Backend في نفس المستودع
بديل لـ REST/GraphQL في monorepo
تطبيقات تحتاج لتحديثات فورية (real-time) مع RPC pattern
✨ المميزات
أبرز مميزات هذه الأداة
End-to-end type safety بدون code generation
أداء ممتاز – لا serialization overhead
Autocomplete كامل في الـ Frontend
لا حاجة لـ OpenAPI/schema منفصل
React/Next.js integration ممتاز
دعم subscriptions (real-time)
caching مدمج مع TanStack Query
⚠️ العيوب
نقاط يجب مراعاتها
يتطلب TypeScript في كلا الطرفين
ليس مناسباً لـ public APIs (العملاء يجب أن يستخدموا TypeScript)
لا يوجد schema definition language مثل GraphQL
مجتمع أصغر مقارنة بـ REST/GraphQL
أقل tools و ecosystem
🔄 البدائل
أدوات بديلة يمكنك استخدامها
💻 مثال على الاستخدام
كيفية استخدام هذه الأداة
// Backend (router)
import { initTRPC } from '@trpc/server';
import { z } from 'zod';
const t = initTRPC.create();
const appRouter = t.router({
getUser: t.procedure
.input(z.object({ id: z.string() }))
.query(async ({ input }) => {
return await db.user.findUnique({ where: { id: input.id } });
}),
createUser: t.procedure
.input(z.object({ name: z.string(), email: z.string() }))
.mutation(async ({ input }) => {
return await db.user.create({ data: input });
}),
});
// Frontend (React)
import { createTRPCReact } from '@trpc/react-query';
const trpc = createTRPCReact<AppRouter>();
function UserProfile({ id }: { id: string }) {
const { data: user } = trpc.getUser.useQuery({ id });
// user is fully typed! ✅
return <div>{user?.name}</div>;
}
📚 أدوات أخرى في TypeScript
قد يعجبك أيضاً
Drizzle-Type
⭐أنواع TypeScript لـ Drizzle ORM (ORM Type Definitions)
Prisma-Type
⭐أنواع TypeScript لـ Prisma ORM (ORM Type Definitions)
ts-node
⭐مُشغّل TypeScript (TypeScript Runtime)
tsx
⭐مُشغّل TypeScript سريع (Fast TypeScript Runtime)
TypeChallenges
⭐مصدر تعلم TypeScript عن طريق التحدي (TypeScript Learning Resource)
TypeScript-Powered-Tools
⭐أدوات مبنية على TypeScript (TypeScript Ecosystem Tools)