🔧 Modul 3: Fejlett MCP Fejlesztés az AI Toolkit segítségével

🎯 Tanulási célok

A labor végére képes leszel:

✅ Egyedi MCP szervereket létrehozni az AI Toolkit segítségével
✅ Beállítani és használni a legfrissebb MCP Python SDK-t (v1.9.3)
✅ Telepíteni és használni az MCP Inspectort hibakereséshez
✅ Hibakeresni MCP szervereket mind az Agent Builder, mind az Inspector környezetben
✅ Megérteni a fejlett MCP szerverfejlesztési munkafolyamatokat

📋 Előfeltételek

A 2. labor (MCP Alapok) elvégzése
VS Code AI Toolkit kiterjesztéssel telepítve
Python 3.10+ környezet
Node.js és npm az Inspector telepítéséhez

🏗️ Amit építeni fogsz

Ebben a laborban egy Weather MCP Server-t hozol létre, amely bemutatja:

Egyedi MCP szerver megvalósítását
Integrációt az AI Toolkit Agent Builderrel
Professzionális hibakeresési munkafolyamatokat
Modern MCP SDK használati mintákat

🔧 Fő komponensek áttekintése

🐍 MCP Python SDK

A Model Context Protocol Python SDK adja az alapot az egyedi MCP szerverek építéséhez. A 1.9.3-as verziót használod, amely fejlett hibakeresési funkciókat tartalmaz.

🔍 MCP Inspector

Egy erőteljes hibakereső eszköz, amely lehetővé teszi:

A szerver valós idejű monitorozását
Az eszközök futtatásának vizualizálását
Hálózati kérések és válaszok vizsgálatát
Interaktív tesztelési környezetet

📖 Lépésről lépésre megvalósítás

1. lépés: Hozz létre egy WeatherAgent-et az Agent Builderben

Indítsd el az Agent Buildert a VS Code AI Toolkit kiterjesztésén keresztül
Hozz létre egy új agentet a következő beállításokkal:
- Agent neve: WeatherAgent

2. lépés: Inicializáld az MCP Server projektet

Navigálj a Tools → Add Tool menüpontra az Agent Builderben
Válaszd ki az "MCP Server" opciót
Válaszd a "Create A new MCP Server" lehetőséget
Válaszd a python-weather sablont
Nevezd el a szervered: weather_mcp

3. lépés: Nyisd meg és vizsgáld meg a projektet

Nyisd meg a generált projektet a VS Code-ban

Tekintsd át a projekt struktúráját:

weather_mcp/
├── src/
│   ├── __init__.py
│   └── server.py
├── inspector/
│   ├── package.json
│   └── package-lock.json
├── .vscode/
│   ├── launch.json
│   └── tasks.json
├── pyproject.toml
└── README.md

4. lépés: Frissítsd a legújabb MCP SDK-ra

🔍 Miért frissítsünk? A legújabb MCP SDK-t (v1.9.3) és Inspector szolgáltatást (0.14.0) szeretnénk használni a fejlettebb funkciók és jobb hibakeresés érdekében.

4a. Python függőségek frissítése

Szerkeszd a pyproject.toml fájlt: frissítsd a ./code/weather_mcp/pyproject.toml fájlt

4b. Inspector konfiguráció frissítése

Szerkeszd az inspector/package.json fájlt: frissítsd a ./code/weather_mcp/inspector/package.json fájlt

4c. Inspector függőségek frissítése

Szerkeszd az inspector/package-lock.json fájlt: frissítsd a ./code/weather_mcp/inspector/package-lock.json fájlt

📝 Megjegyzés: Ez a fájl kiterjedt függőségdefiníciókat tartalmaz. Lentebb a lényeges szerkezet látható – a teljes tartalom biztosítja a helyes függőségkezelést.

⚡ Teljes Package Lock: A teljes package-lock.json körülbelül 3000 sor függőségdefiníciót tartalmaz. A fentiek a kulcsfontosságú szerkezetet mutatják – a teljes függőségkezeléshez használd a mellékelt fájlt.

5. lépés: VS Code hibakeresés beállítása

Megjegyzés: Kérjük, másold át a megadott elérési úton található fájlt a helyi fájl felülírásához

5a. Indítási konfiguráció frissítése

Szerkeszd a .vscode/launch.json fájlt:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Attach to Local MCP",
      "type": "debugpy",
      "request": "attach",
      "connect": {
        "host": "localhost",
        "port": 5678
      },
      "presentation": {
        "hidden": true
      },
      "internalConsoleOptions": "neverOpen",
      "postDebugTask": "Terminate All Tasks"
    },
    {
      "name": "Launch Inspector (Edge)",
      "type": "msedge",
      "request": "launch",
      "url": "http://localhost:6274?timeout=60000&serverUrl=http://localhost:3001/sse#tools",
      "cascadeTerminateToConfigurations": [
        "Attach to Local MCP"
      ],
      "presentation": {
        "hidden": true
      },
      "internalConsoleOptions": "neverOpen"
    },
    {
      "name": "Launch Inspector (Chrome)",
      "type": "chrome",
      "request": "launch",
      "url": "http://localhost:6274?timeout=60000&serverUrl=http://localhost:3001/sse#tools",
      "cascadeTerminateToConfigurations": [
        "Attach to Local MCP"
      ],
      "presentation": {
        "hidden": true
      },
      "internalConsoleOptions": "neverOpen"
    }
  ],
  "compounds": [
    {
      "name": "Debug in Agent Builder",
      "configurations": [
        "Attach to Local MCP"
      ],
      "preLaunchTask": "Open Agent Builder",
    },
    {
      "name": "Debug in Inspector (Edge)",
      "configurations": [
        "Launch Inspector (Edge)",
        "Attach to Local MCP"
      ],
      "preLaunchTask": "Start MCP Inspector",
      "stopAll": true
    },
    {
      "name": "Debug in Inspector (Chrome)",
      "configurations": [
        "Launch Inspector (Chrome)",
        "Attach to Local MCP"
      ],
      "preLaunchTask": "Start MCP Inspector",
      "stopAll": true
    }
  ]
}

Szerkeszd a .vscode/tasks.json fájlt:

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Start MCP Server",
      "type": "shell",
      "command": "python -m debugpy --listen 127.0.0.1:5678 src/__init__.py sse",
      "isBackground": true,
      "options": {
        "cwd": "${workspaceFolder}",
        "env": {
          "PORT": "3001"
        }
      },
      "problemMatcher": {
        "pattern": [
          {
            "regexp": "^.*$",
            "file": 0,
            "location": 1,
            "message": 2
          }
        ],
        "background": {
          "activeOnStart": true,
          "beginsPattern": ".*",
          "endsPattern": "Application startup complete|running"
        }
      }
    },
    {
      "label": "Start MCP Inspector",
      "type": "shell",
      "command": "npm run dev:inspector",
      "isBackground": true,
      "options": {
        "cwd": "${workspaceFolder}/inspector",
        "env": {
          "CLIENT_PORT": "6274",
          "SERVER_PORT": "6277",
        }
      },
      "problemMatcher": {
        "pattern": [
          {
            "regexp": "^.*$",
            "file": 0,
            "location": 1,
            "message": 2
          }
        ],
        "background": {
          "activeOnStart": true,
          "beginsPattern": "Starting MCP inspector",
          "endsPattern": "Proxy server listening on port"
        }
      },
      "dependsOn": [
        "Start MCP Server"
      ]
    },
    {
      "label": "Open Agent Builder",
      "type": "shell",
      "command": "echo ${input:openAgentBuilder}",
      "presentation": {
        "reveal": "never"
      },
      "dependsOn": [
        "Start MCP Server"
      ],
    },
    {
      "label": "Terminate All Tasks",
      "command": "echo ${input:terminate}",
      "type": "shell",
      "problemMatcher": []
    }
  ],
  "inputs": [
    {
      "id": "openAgentBuilder",
      "type": "command",
      "command": "ai-mlstudio.agentBuilder",
      "args": {
        "initialMCPs": [ "local-server-weather_mcp" ],
        "triggeredFrom": "vsc-tasks"
      }
    },
    {
      "id": "terminate",
      "type": "command",
      "command": "workbench.action.tasks.terminate",
      "args": "terminateAll"
    }
  ]
}

🚀 MCP szerver futtatása és tesztelése

6. lépés: Függőségek telepítése

A konfigurációs módosítások után futtasd a következő parancsokat:

Python függőségek telepítése:

uv sync

Inspector függőségek telepítése:

cd inspector
npm install

7. lépés: Hibakeresés az Agent Builderrel

Nyomd meg az F5-öt vagy válaszd a "Debug in Agent Builder" konfigurációt
Válaszd ki az összetett konfigurációt a hibakereső panelen
Várd meg, amíg elindul a szerver és megnyílik az Agent Builder
Teszteld az időjárás MCP szerveredet természetes nyelvű lekérdezésekkel

Írj be például ilyet:

SYSTEM_PROMPT

You are my weather assistant

USER_PROMPT

How's the weather like in Seattle

8. lépés: Hibakeresés az MCP Inspectorral

Használd a "Debug in Inspector" konfigurációt (Edge vagy Chrome böngészőben)
Nyisd meg az Inspector felületét a http://localhost:6274 címen
Fedezd fel az interaktív tesztelési környezetet:
- Nézd meg az elérhető eszközöket
- Teszteld az eszközök futtatását
- Figyeld a hálózati kéréseket
- Hibakeresd a szerver válaszait

🎯 Fő tanulságok

A labor elvégzésével:

Létrehoztál egy egyedi MCP szervert az AI Toolkit sablonjai alapján
Frissítettél a legújabb MCP SDK-ra (v1.9.3) a jobb funkcionalitásért
Beállítottál professzionális hibakeresési munkafolyamatokat mind az Agent Builder, mind az Inspector számára
Telepítetted az MCP Inspectort az interaktív szerverteszteléshez
Elsajátítottad a VS Code hibakeresési konfigurációit MCP fejlesztéshez

🔧 Felfedezett fejlett funkciók

Funkció	Leírás	Használati eset
MCP Python SDK v1.9.3	Legújabb protokoll implementáció	Modern szerverfejlesztés
MCP Inspector 0.14.0	Interaktív hibakereső eszköz	Valós idejű szervertesztelés
VS Code hibakeresés	Integrált fejlesztői környezet	Professzionális hibakeresési munkafolyamat
Agent Builder integráció	Közvetlen AI Toolkit kapcsolat	Végponttól végpontig terjedő agent tesztelés

📚 További források

🎉 Gratulálunk! Sikeresen befejezted a 3. labort, és most már képes vagy egyedi MCP szervereket létrehozni, hibakeresni és telepíteni professzionális fejlesztési munkafolyamatokkal.

🔜 Folytatás a következő modullal

Készen állsz, hogy az MCP tudásodat valós fejlesztési munkafolyamatban alkalmazd? Folytasd a 4. modul: Gyakorlati MCP fejlesztés – Egyedi GitHub klón szerver modullal, ahol:

Egy éles környezetbe szánt MCP szervert építesz, amely automatizálja a GitHub tárhely műveleteket
Megvalósítod a GitHub tárhely klónozását MCP-n keresztül
Integrálod az egyedi MCP szervereket a VS Code-dal és a GitHub Copilot Agent Mode-dal
Teszteled és élesíted az egyedi MCP szervereket
Megtanulod a fejlesztők számára hasznos munkafolyamat-automatizálást

Jogi nyilatkozat:
Ez a dokumentum az AI fordító szolgáltatás, a Co-op Translator segítségével készült. Bár a pontosságra törekszünk, kérjük, vegye figyelembe, hogy az automatikus fordítások hibákat vagy pontatlanságokat tartalmazhatnak. Az eredeti dokumentum az anyanyelvén tekintendő hiteles forrásnak. Fontos információk esetén szakmai, emberi fordítást javaslunk. Nem vállalunk felelősséget a fordítás használatából eredő félreértésekért vagy téves értelmezésekért.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

🔧 Modul 3: Fejlett MCP Fejlesztés az AI Toolkit segítségével

🎯 Tanulási célok

📋 Előfeltételek

🏗️ Amit építeni fogsz

🔧 Fő komponensek áttekintése

🐍 MCP Python SDK

🔍 MCP Inspector

📖 Lépésről lépésre megvalósítás

1. lépés: Hozz létre egy WeatherAgent-et az Agent Builderben

2. lépés: Inicializáld az MCP Server projektet

3. lépés: Nyisd meg és vizsgáld meg a projektet

4. lépés: Frissítsd a legújabb MCP SDK-ra

4a. Python függőségek frissítése

4b. Inspector konfiguráció frissítése

4c. Inspector függőségek frissítése

5. lépés: VS Code hibakeresés beállítása

5a. Indítási konfiguráció frissítése

🚀 MCP szerver futtatása és tesztelése

6. lépés: Függőségek telepítése

7. lépés: Hibakeresés az Agent Builderrel

8. lépés: Hibakeresés az MCP Inspectorral

🎯 Fő tanulságok

🔧 Felfedezett fejlett funkciók

📚 További források

🔜 Folytatás a következő modullal

FilesExpand file tree

README.md

Latest commit

History

README.md

File metadata and controls

🔧 Modul 3: Fejlett MCP Fejlesztés az AI Toolkit segítségével

🎯 Tanulási célok

📋 Előfeltételek

🏗️ Amit építeni fogsz

🔧 Fő komponensek áttekintése

🐍 MCP Python SDK

🔍 MCP Inspector

📖 Lépésről lépésre megvalósítás

1. lépés: Hozz létre egy WeatherAgent-et az Agent Builderben

2. lépés: Inicializáld az MCP Server projektet

3. lépés: Nyisd meg és vizsgáld meg a projektet

4. lépés: Frissítsd a legújabb MCP SDK-ra

4a. Python függőségek frissítése

4b. Inspector konfiguráció frissítése

4c. Inspector függőségek frissítése

5. lépés: VS Code hibakeresés beállítása

5a. Indítási konfiguráció frissítése

🚀 MCP szerver futtatása és tesztelése

6. lépés: Függőségek telepítése

7. lépés: Hibakeresés az Agent Builderrel

8. lépés: Hibakeresés az MCP Inspectorral

🎯 Fő tanulságok

🔧 Felfedezett fejlett funkciók

📚 További források

🔜 Folytatás a következő modullal