MCP Web 101

🚀 MCP網絡教程

這是一個交互式的網絡教程，旨在幫助學習者掌握如何構建MCP（模型上下文協議）服務器。該教育網站提供了從零開始實現和理解MCP服務器的詳細分步指導。

✨ 主要特性

• 📱 採用移動優先方法的現代、響應式設計
• 📚 內容全面的教程
• ⚡ 即時代碼示例
• 🎨 代碼語法高亮顯示
• 📋 支持複製到剪貼板功能
• 🌐 提供安裝指南
• 📊 可進行進度跟蹤
• 🔍 有步驟詳細的安裝指南
• 🌐 具備交互式UI元素
• 🔄 可即時預覽
• 🌙 支持深色模式

🚀 快速開始

📋 前置條件

• Node.js（v14或更高版本） 💻
• npm 或 yarn 📦

📦 安裝指南

1. 克隆倉庫：

git clone https://github.com/opestro/mcp-web.git
cd mcp-web

2. 安裝依賴項：

npm install

3. 啟動服務器：

node server.js

4. 打開瀏覽器訪問 http://localhost:3000 🌐

📚 詳細文檔

📁 項目結構

mcp-web/
├── views/              # EJS 模板
│   ├── layout.ejs      # 主佈局模板 🏗️
│   ├── index.ejs       # 首頁 🏠
│   ├── installation.ejs # 安裝指南 ⚙️
│   └── tutorial.ejs    # 教程內容 📚
├── public/             # 靜態資產 🖼️
│   └── image.png       # 主圖 🖼️
├── server.js           # Express 服務器 🖥️
└── package.json        # 依賴項 📦

🛠️ 使用的技術

• ⚡ Express.js - 網絡框架
• 🧩 EJS - 模板引擎
• 💅 TailwindCSS - 樣式設計
• ✨ Prism.js - 代碼語法高亮

🤝 貢獻指南

歡迎貢獻！請隨意提交Pull Request。

1. 叉克項目 🍴
2. 創建功能分支（git checkout -b feature/amazing-feature）
3. 提交更改（git commit -m '添加一些很棒的功能'）
4. 推送到分支（git push origin feature/amazing-feature）
5. 打開Pull Request 📬

✍️ 作者

Mehdi Harzallah

• 💼 LinkedIn: Mehdi Harzallah
• 🐱 GitHub: @opestro
• 📧 Email: mahdiharzallah21@gmail.com

📄 許可證

本項目使用 MIT License - 請查看 LICENSE 文件瞭解詳情。

🙏 致謝

感謝所有幫助構建此教育資源的貢獻者 ❤️

• 特別鳴謝MCP社區 🌟

💬 支持

如需支持，請：

• 🐞 在GitHub上打開一個問題
• 💬 通過WhatsApp聯繫：+213 778191078
• 📧 發送電子郵件到 mahdiharzallah21@gmail.com