كيفية كتابة REST API باستخدام TypeScript في 30 دقيقة: عملياً

مدرب بايثون أونلاين للمبتدئين

تعلم Python بسهولة دون إرهاق نظري. حل مهام عملية مع التحقق التلقائي واكتب الكود مباشرة في المتصفح.

ابدأ الدورة

مقدمة: لماذا TypeScript وREST API هما الثنائي المثالي للتطوير السريع

\n

يتطلب تطوير الويب الحديث السرعة والموثوقية. إذا كنت بحاجة إلى إنشاء backend سريع لتطبيق جوال أو خدمة ويب أو بنية خدمات مصغرة، فإن مجموعة TypeScript + Node.js + Express هي واحدة من أكثر الأدوات فعالية. يضيف TypeScript كتابة صارمة للأنواع إلى JavaScript، مما يسمح باكتشاف الأخطاء في مرحلة التجميع بدلاً من وقت التشغيل. هذا ذو قيمة خاصة عند بناء REST API، حيث يجب أن يعرف كل endpoint بوضوح البيانات التي يستقبلها ويعيدها.

\n

في هذه المقالة، سنقوم في 30 دقيقة بإنشاء REST API كامل لإدارة قائمة المهام (To-Do List). ستتعلم كيفية إعداد المشروع، وكتابة المتحكمات (controllers)، والمسارات (routes)، والبرمجيات الوسيطة (middleware). كل ذلك مع أمثلة عملية وكود جاهز.

\n\n

إعداد المشروع وتهيئته (5 دقائق)

\n

أولاً، سنقوم بإنشاء هيكل المشروع وتثبيت التبعيات.

\n
mkdir todo-api\ncd todo-api\nnpm init -y\nnpm install express cors uuid\nnpm install -D typescript @types/express @types/cors @types/uuid ts-node nodemon
\n

قم بإنشاء ملف tsconfig.json في جذر المشروع:

\n
{\n  "compilerOptions": {\n    "target": "ES2020",\n    "module": "commonjs",\n    "outDir": "./dist",\n    "rootDir": "./src",\n    "strict": true,\n    "esModuleInterop": true,\n    "skipLibCheck": true\n  },\n  "include": ["src/**/*"]\n}
\n

أضف البرامج النصية في package.json:

\n
"scripts": {\n  "dev": "nodemon --exec ts-node src/index.ts",\n  "build": "tsc",\n  "start": "node dist/index.js"\n}
\n

قم بإنشاء مجلد src وملف index.ts كنقطة دخول.

\n\n

هيكل المجلدات الأساسي

\n
    \n
  • src/index.ts — نقطة الدخول، تشغيل الخادم
  • \n
  • src/routes/tasks.ts — مسارات المهام
  • \n
  • src/controllers/taskController.ts — منطق معالجة الطلبات
  • \n
  • src/models/task.ts — الواجهات والأنواع
  • \n
  • src/middleware/errorHandler.ts — معالجة الأخطاء (اختياري)
  • \n
\n\n

إنشاء نموذج البيانات والواجهات (5 دقائق)

\n

دعنا نحدد أنواع البيانات لمهمتنا. قم بإنشاء ملف src/models/task.ts:

\n
export interface Task {\n  id: string;\n  title: string;\n  completed: boolean;\n  createdAt: Date;\n}\n\nexport type CreateTaskDto = Pick<Task, 'title'>;\nexport type UpdateTaskDto = Partial<Pick<Task, 'title' | 'completed'>>;
\n

هنا نستخدم Pick و Partial — أنواع الأدوات المضمنة في TypeScript. CreateTaskDto يقبل العنوان فقط، بينما UpdateTaskDto يقبل حقولاً اختيارية للتحديث الجزئي.

\n\n

كتابة المتحكمات والمسارات (15 دقيقة)

\n

الآن الجزء الممتع — منطق التطبيق. سنقوم بإنشاء مخزن مؤقت للمهام في الذاكرة (in-memory storage). للإنتاج، يجب استبداله بقاعدة بيانات.

\n\n

متحكم المهام

\n

ملف src/controllers/taskController.ts:

\n
import { Request, Response } from 'express';\nimport { v4 as uuidv4 } from 'uuid';\nimport { Task, CreateTaskDto, UpdateTaskDto } from '../models/task';\n\n// مخزن مؤقت\nlet tasks: Task[] = [];\n\n// GET /api/tasks\nexport const getAllTasks = (req: Request, res: Response) => {\n  res.json(tasks);\n};\n\n// GET /api/tasks/:id\nexport const getTaskById = (req: Request, res: Response) => {\n  const task = tasks.find(t => t.id === req.params.id);\n  if (!task) {\n    return res.status(404).json({ message: 'المهمة غير موجودة' });\n  }\n  res.json(task);\n};\n\n// POST /api/tasks\nexport const createTask = (req: Request, res: Response) => {\n  const { title } = req.body as CreateTaskDto;\n  if (!title || typeof title !== 'string') {\n    return res.status(400).json({ message: 'حقل title مطلوب ويجب أن يكون نصاً' });\n  }\n                

المدونات

توصيات الكتب