مقدمة في MCP: دليل البدء السريع للمبتدئين

أنيس مروشيAI Bot
بواسطة أنيس مروشي & AI Bot ·

جاري تحميل مشغل تحويل النص إلى كلام الصوتي...

جاهز لربط الذكاء الاصطناعي ببياناتك؟ سيمكنك هذا الدليل السريع من بناء أول خادم MCP في 15 دقيقة فقط. لا حاجة لخبرة سابقة في MCP!

ماذا ستتعلم

في هذا الدرس المناسب للمبتدئين، ستقوم بـ:

  • فهم ما هو MCP ولماذا هو مهم
  • إعداد بيئة تطوير MCP كاملة
  • بناء أول خادم MCP من الصفر
  • توصيل الخادم بتطبيق ذكاء اصطناعي

لنبدأ!


المتطلبات الأولية

قبل البدء، تأكد من أن لديك:

  • Node.js 18+ مثبت (حمّل من هنا)
  • npm أو pnpm كمدير حزم
  • معرفة أساسية بـ TypeScript/JavaScript (المتغيرات، الدوال، async/await)
  • محرر أكواد (VS Code موصى به)
  • إلمام بالطرفية/سطر الأوامر

لا حاجة لخبرة سابقة في MCP. سنشرح كل شيء خطوة بخطوة.


ما هو MCP؟

بروتوكول سياق النموذج (MCP) هو بروتوكول مفتوح طورته Anthropic يوحد كيفية اتصال تطبيقات الذكاء الاصطناعي بمصادر البيانات والأدوات الخارجية.

فكر في MCP كـ محول عالمي للذكاء الاصطناعي:

  • تماماً مثل USB-C الذي يوصل أجهزتك بأي طرفية متوافقة
  • MCP يوصل نماذج الذكاء الاصطناعي بأي مصدر بيانات أو أداة متوافقة

لماذا نستخدم MCP؟

بدون MCP، يتطلب توصيل الذكاء الاصطناعي ببياناتك كتابة كود مخصص لكل تكامل. مع MCP:

بدون MCPمع MCP
كود مخصص لكل مزود ذكاء اصطناعيبروتوكول قياسي واحد
ارتباط وثيق بين الذكاء الاصطناعي والأدواتخوادم معيارية قابلة لإعادة الاستخدام
أمان متغير حسب التنفيذأنماط أمان مدمجة
صعوبة تغيير مزود الذكاء الاصطناعيسهولة تبديل المزودين

نظرة عامة على بنية MCP

يستخدم MCP نموذج خادم-عميل:

[تطبيق الذكاء الاصطناعي] <---> [عميل MCP] <---> [خادم MCP] <---> [بياناتك/أدواتك]
  • خادم MCP: يكشف الأدوات والبيانات لتطبيقات الذكاء الاصطناعي
  • عميل MCP: يعيش في تطبيق الذكاء الاصطناعي، يتواصل مع الخوادم
  • الأدوات: دوال يمكن للذكاء الاصطناعي استدعاؤها (جلب البيانات، تنفيذ الإجراءات)

الخطوة 1: إعداد المشروع

لننشئ أول خادم MCP. افتح الطرفية ونفذ:

# إنشاء مجلد المشروع
mkdir mcp-hello-world
cd mcp-hello-world
 
# تهيئة مشروع Node.js
npm init -y

ثبت التبعيات المطلوبة:

# تثبيت MCP SDK و Zod للتحقق
npm install @modelcontextprotocol/sdk zod
 
# تثبيت تبعيات تطوير TypeScript
npm install -D typescript @types/node

الخطوة 2: تكوين TypeScript

أنشئ ملف tsconfig.json في جذر المشروع:

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "Node16",
    "moduleResolution": "Node16",
    "outDir": "./build",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "declaration": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules"]
}

حدّث package.json ليشمل سكريبت البناء ونوع الوحدة:

{
  "name": "mcp-hello-world",
  "version": "1.0.0",
  "type": "module",
  "scripts": {
    "build": "tsc",
    "start": "node build/index.js"
  },
  "dependencies": {
    "@modelcontextprotocol/sdk": "^0.5.0",
    "zod": "^3.22.0"
  },
  "devDependencies": {
    "@types/node": "^20.0.0",
    "typescript": "^5.0.0"
  }
}

أنشئ مجلد المصدر:

mkdir src

الخطوة 3: بناء أول خادم MCP

أنشئ ملف الخادم الرئيسي في src/index.ts:

import { Server } from "@modelcontextprotocol/sdk/server/index.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
import {
  CallToolRequestSchema,
  ListToolsRequestSchema,
} from "@modelcontextprotocol/sdk/types.js";
import { z } from "zod";
 
// تعريف مخطط التحقق لأداتنا
const GreetingSchema = z.object({
  name: z.string().describe("اسم الشخص للترحيب به"),
});
 
// إنشاء نسخة خادم MCP
const server = new Server(
  {
    name: "hello-world-server",
    version: "1.0.0",
  },
  {
    capabilities: {
      tools: {},
    },
  }
);
 
// المعالج: سرد الأدوات المتاحة
server.setRequestHandler(ListToolsRequestSchema, async () => {
  return {
    tools: [
      {
        name: "greet",
        description: "توليد تحية ودية لشخص",
        inputSchema: {
          type: "object",
          properties: {
            name: {
              type: "string",
              description: "اسم الشخص للترحيب به",
            },
          },
          required: ["name"],
        },
      },
      {
        name: "get_current_time",
        description: "الحصول على التاريخ والوقت الحاليين",
        inputSchema: {
          type: "object",
          properties: {},
          required: [],
        },
      },
    ],
  };
});
 
// المعالج: تنفيذ استدعاءات الأدوات
server.setRequestHandler(CallToolRequestSchema, async (request) => {
  const { name, arguments: args } = request.params;
 
  if (name === "greet") {
    const { name: personName } = GreetingSchema.parse(args);
    const greeting = `مرحباً، ${personName}! أهلاً بك في عالم MCP.`;
 
    return {
      content: [
        {
          type: "text",
          text: greeting,
        },
      ],
    };
  }
 
  if (name === "get_current_time") {
    const now = new Date();
    const timeString = now.toLocaleString("ar-SA", {
      weekday: "long",
      year: "numeric",
      month: "long",
      day: "numeric",
      hour: "2-digit",
      minute: "2-digit",
      second: "2-digit",
    });
 
    return {
      content: [
        {
          type: "text",
          text: `الوقت الحالي هو: ${timeString}`,
        },
      ],
    };
  }
 
  throw new Error(`أداة غير معروفة: ${name}`);
});
 
// الدالة الرئيسية لبدء الخادم
async function main() {
  const transport = new StdioServerTransport();
  await server.connect(transport);
  console.error("خادم MCP Hello World يعمل الآن!");
}
 
main().catch((error) => {
  console.error("خطأ فادح:", error);
  process.exit(1);
});

فهم الكود

لنحلل ما يفعله كل جزء:

  1. إنشاء الخادم: ننشئ خادم MCP جديد باسم وإصدار
  2. ListToolsRequestSchema: يخبر عملاء الذكاء الاصطناعي بالأدوات المتاحة
  3. CallToolRequestSchema: يعالج تنفيذ الأدوات الفعلي عندما يستدعيها الذكاء الاصطناعي
  4. StdioServerTransport: طبقة الاتصال باستخدام stdin/stdout

الخطوة 4: البناء والاختبار

جمّع كود TypeScript:

npm run build

يجب أن ترى ملف build/index.js تم إنشاؤه. خادمك جاهز!

اختبار سريع

للتحقق من أنه يعمل، يمكنك تشغيله مباشرة (سينتظر رسائل بروتوكول MCP):

npm start

يجب أن ترى: خادم MCP Hello World يعمل الآن!


الخطوة 5: الاتصال بتطبيق ذكاء اصطناعي

الآن لنوصل خادمك بتطبيق ذكاء اصطناعي. الطريقة الأكثر شيوعاً هي عبر Claude Desktop.

تكوين Claude Desktop

  1. افتح إعدادات Claude Desktop
  2. انتقل إلى تكوين خوادم MCP
  3. أضف خادمك:
{
  "mcpServers": {
    "hello-world": {
      "command": "node",
      "args": ["/المسار/المطلق/إلى/mcp-hello-world/build/index.js"]
    }
  }
}
  1. أعد تشغيل Claude Desktop
  2. اطلب من Claude "رحب بأحمد" أو "كم الساعة الآن"

الخطوات التالية

تهانينا! لقد بنيت أول خادم MCP. إليك بعض الخطوات التالية:

توسيع خادمك

أضف أدوات أكثر فائدة:

  • الوصول إلى نظام الملفات
  • تكاملات API
  • استعلامات قاعدة البيانات
  • منطق الأعمال المخصص

تعلم المزيد

استكشاف النظام البيئي


مرجع سريع

هيكل المشروع

mcp-hello-world/
├── src/
│   └── index.ts      # كود الخادم
├── build/
│   └── index.js      # المخرجات المجمعة
├── package.json
└── tsconfig.json

المفاهيم الأساسية

المفهومالوصف
الخادميكشف الأدوات والبيانات للذكاء الاصطناعي
الأداةدالة يمكن للذكاء الاصطناعي استدعاؤها
النقلطبقة الاتصال (stdio، HTTP)
المخططيحدد مدخلات ومخرجات الأدوات

استكشاف الأخطاء

أخطاء البناء؟ تأكد من استخدام Node.js 18+ وأنك ثبتت جميع التبعيات.

الخادم لا يستجيب؟ تحقق من أن المسار في تكوين عميل الذكاء الاصطناعي مطلق وصحيح.

الأدوات لا تظهر؟ أعد تشغيل تطبيق الذكاء الاصطناعي بعد تحديث تكوين الخادم.


الملخص

في هذا الدليل السريع، تعلمت:

  1. ما هو MCP - بروتوكول عالمي لربط الذكاء الاصطناعي بالأدوات والبيانات
  2. كيفية الإعداد - هيكل المشروع، تكوين TypeScript، التبعيات
  3. كيفية البناء - إنشاء خادم بأدوات يمكن للذكاء الاصطناعي استدعاؤها
  4. كيفية الاتصال - التكامل مع Claude Desktop أو العملاء البرمجيين

لديك الآن الأساس لبناء تكاملات ذكاء اصطناعي قوية باستخدام MCP. ابدأ بالتجربة وانظر ماذا يمكنك إنشاؤه!


المرجع: هذا الدرس يتبع وثائق بروتوكول سياق النموذج الرسمية.


هل تريد قراءة المزيد من الدروس التعليمية؟ تحقق من أحدث درس تعليمي لدينا على 4 أساسيات Laravel 11: حماية CSRF.

ناقش مشروعك معنا

نحن هنا للمساعدة في احتياجات تطوير الويب الخاصة بك. حدد موعدًا لمناقشة مشروعك وكيف يمكننا مساعدتك.

دعنا نجد أفضل الحلول لاحتياجاتك.

مقالات ذات صلة

البدء مع ALLaM-7B-Instruct-preview

تعلم كيفية استخدام نموذج ALLaM-7B-Instruct-preview مع Python، وكيفية التفاعل معه من JavaScript عبر واجهة برمجة تطبيقات مستضافة (مثل Hugging Face Spaces).

8 د قراءة·