Website Builder MCP Server

网站生成器MCP服务器

一个模型上下文协议（MCP）服务器，用于通过Excel数据集成自动生成网站。

🚀 特性

• ✅ 多个网站模板 -作品集、博客、目录、目录
• ✅ Excel数据集成 -直接从Excel文件构建网站
• ✅ 组件生成 -导航栏、英雄、卡片、多种样式的表格
• ✅ 响应式设计 -支持移动端的现代CSS框架
• ✅ MCP协议 -完整模型上下文协议服务器实现
• ✅ 自动页面 -从Excel行生成单个页面

📊 Excel集成

将Excel电子表格转换为完整的网站：

产品目录 📦

• Excel格式： 产品名称、描述、价格、类别、图片
• 生成： 产品网格、单个产品页面、类别过滤
• 非常适合： 电子商务网站、库存展示

员工名录 👥

• Excel格式： 姓名、职务、部门、电子邮件、电话、简历
• 生成： 团队概述、个人简介、部门页面
• 非常适合： 公司网站、组织目录

投资组合网站 💼

• Excel格式： 项目名称、描述、技术、链接、状态
• 生成： 项目展示、技术筛选、项目详情
• 非常适合： 开发商组合、代理展示

自定义数据站点 📋

• Excel格式： 任何结构化数据
• 生成： 数据表、可搜索列表、自定义布局
• 非常适合： 报告、列表、目录

🛠️ 安装

# Clone the repository
git clone https://github.com/pmkhairnarr/website-builder-mcp.git
cd website-builder-mcp

# Install dependencies
npm install

# Start the MCP server
npm start

📝 用法

基本网站创建

// Create website from template
{
  "name": "create_website",
  "arguments": {
    "name": "my-portfolio",
    "template": "portfolio", 
    "title": "My Portfolio",
    "description": "Showcasing my work"
  }
}

Excel驱动的网站

// Build from Excel file
{
  "name": "build_from_excel",
  "arguments": {
    "excelFile": "./examples/sample-products.xlsx",
    "template": "catalog",
    "siteName": "product-catalog",
    "sheetName": "Products"
  }
}

📂 项目结构

website-builder-mcp/
├── server.js              # Main MCP server
├── package.json           # Dependencies & scripts  
├── templates/             # HTML/CSS templates
│   ├── base.html         # Base page template
│   └── styles.css        # Responsive CSS framework
├── examples/              # Sample Excel files
│   ├── sample-products.xlsx
│   ├── sample-directory.xlsx
│   └── sample-portfolio.xlsx
├── websites/              # Generated websites
└── tests/                 # Test files

🔧 可用工具

核心工具

• create_website -从模板创建
• add_page -向现有网站添加页面
• generate_component -创建HTML组件
• list_websites -列出所有已创建的网站

Excel工具

• build_from_excel -从Excel数据生成完整网站

📋 Excel文件格式

产品目录示例

员工目录示例

投资组合示例

🧪 测试

# Test Excel integration
npm run test:excel

# Test MCP server
npm test

# Run direct functionality test  
node direct-test.js

🌐 生成的网站

网站是在 websites/ 目录包含：

• 响应式HTML 页面
• 现代CSS 造型
• 站点配置 （site.json）
• 导航 页面之间
• 移动友好 设计

🔗 MCP集成

与MCP兼容的客户端一起使用：

• 带有MCP扩展的VS代码
• 克劳德桌面版
• 自定义MCP客户端

📖 API文档

MCP服务器配置

{
  "mcpServers": {
    "website-builder": {
      "command": "node",
      "args": ["server.js"],
      "cwd": "./website-builder-mcp"
    }
  }
}

🤝 贡献

1. 复刻仓库
2. 创建特征分支(git checkout -b feature/amazing-feature)
3. 提交更改(git commit -m 'Add amazing feature')
4. 推送到分支(git push origin feature/amazing-feature)
5. 打开拉取请求

📄 许可证

此项目根据MIT许可证获得许可-请参阅 许可证 文件以获取详细信息。

🎯 用例

• 商业网站 -根据员工数据生成公司网站
• 产品展示 -从库存电子表格创建目录
• 投资组合网站 -基于工作数据构建项目展示
• 目录站点 -根据联系人数据创建可搜索列表
• 报告网站 -将数据报告转换为web演示文稿

🚀 高级功能

• 自动段塞生成 对于SEO友好的URL
• 响应式网格布局 适用于所有设备尺寸
• 智能列检测 用于Excel处理
• 模板定制 品牌一致性
• 批量处理 对于大型数据集
• 错误处理 有详细的反馈

______________________________________________________________________

内置于❤️ AI开发社区