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

مقدمة

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

في هذا الدليل، سنقوم في غضون 30 دقيقة بإنشاء REST API كامل لإدارة قائمة المهام (Todo list). ستتعلم كيفية إعداد المشروع، ووصف نماذج البيانات، وإنشاء المسارات، وتوصيل قاعدة البيانات. لا نظرية زائدة - فقط تطبيق عملي وكود جاهز للتشغيل.

من المفترض أن يكون لديك بالفعل Node.js (الإصدار 18+) و npm مثبتين. إذا لم يكن الأمر كذلك، فقم بتنزيلهما من الموقع الرسمي.

1. إعداد المشروع وتثبيت التبعيات

لنبدأ بتهيئة مشروع TypeScript جديد. افتح الطرفية ونفذ الأوامر التالية:

mkdir my-todo-apicd my-todo-apinpm init -y

الآن سنقوم بتثبيت الحزم اللازمة:

npm install expressnpm install -D typescript @types/node @types/express ts-node nodemon

لنقم بإنشاء ملف إعداد TypeScript:

npx tsc --init

في ملف tsconfig.json، تأكد من إلغاء التعليق وضبط الأسطر التالية:

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

أنشئ مجلد src وملف src/index.ts - ستكون هذه نقطة الدخول لتطبيقنا.

أضف نصوصًا برمجية في package.json للتشغيل بسهولة:

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

2. إنشاء خادم Express أساسي

الآن سنكتب خادمًا بسيطًا باستخدام Express يستمع على المنفذ 3000. افتح src/index.ts وأضف الكود التالي:

import express, { Request, Response } from 'express';

const app = express();const PORT = 3000;

// Middleware لتحليل JSONapp.use(express.json());

// مسار أساسي للتحققapp.get('/', (req: Request, res: Response) => {  res.send('Todo API يعمل!');});

app.listen(PORT, () => {  console.log(`الخادم يعمل على http://localhost:${PORT}`);});

قم بتشغيل الخادم باستخدام الأمر npm run dev وافتح المتصفح على العنوان http://localhost:3000. يجب أن ترى الرسالة "Todo API يعمل!".

3. تعريف نموذج البيانات والتخزين المؤقت في الذاكرة

للبساطة، لن نقوم بتوصيل قاعدة البيانات فورًا، بل سنستخدم تخزينًا مؤقتًا في الذاكرة. أنشئ ملف src/models/todo.ts:

export interface Todo {  id: number;  title: string;  completed: boolean;  createdAt: Date;}

export let todos: Todo[] = [  { id: 1, title: 'تعلم TypeScript', completed: false, createdAt: new Date() },  { id: 2, title: 'كتابة REST API', completed: false, createdAt: new Date() },];

لاحظ استخدام الواجهة Todo - وهذا يضمن أن جميع الكائنات في المصفوفة لها نفس البنية.

4. تنفيذ مسارات CRUD

لنقم بإنشاء ملف src/routes/todos.ts مع مسارات كاملة لعمليات الإنشاء والقراءة والتحديث والحذف.

import { Router, Request, Response } from 'express';import { Todo, todos } from '../models/todo';

const router = Router();

// GET /api/todos — الحصول على جميع المهامrouter.get('/', (req: Request, res: Response) => {  res.