MCP+CMS演示文稿
关于MCP(模型上下文协议)如何控制内容管理系统的交互式网络演示。
团队
- 艾哈迈德·穆罕默德
- 艾哈迈德·丁达尔
- 阿卜杜勒马利克·卡兹姆
- 索林·扬斯
快速开始
# Install dependencies
npm install
# Start development server
npm run dev
# Build for production
npm run build
部署到Netlify
拖放(最快)
- 跑
npm run build
- 首选https://app.netlify.com/drop
- 拖动
dist 文件夹在那里
- 完成!
来自GitHub
- 推送到GitHub
- 连接到Netlify
- 构建命令:
npm run build
- 发布目录:
dist
幻灯片概述
| # |
幻灯片 |
内容 |
| 1 |
标题 |
团队名称、演示文稿标题、动画流程图 |
| 2 |
什么是MCP? |
带有移动数据包的数据流动画 |
| 3 |
问题 |
旋转展示5个痛点 |
| 4 |
解决方案 |
具有打字效果的AI聊天对话 |
| 5 |
创建帖子 |
实时CMS仪表板动画 |
| 6 |
更新帖子 |
实时内容更新 |
| 7 |
删除帖子 |
通过备份安全删除 |
| 8 |
批量操作 |
100个项目处理动画 |
| 9 |
好处 |
4张动画福利卡 |
| 10 |
非常感谢。 |
AI循环演示→ MCP → CMS流程 |
导航
| 关键 |
行动 |
→ / Space / Enter |
下一张幻灯片 |
← / Backspace |
上一张幻灯片 |
Home |
第一张幻灯片 |
End |
最后一张幻灯片 |
| 滑动 |
触摸导航 |
特性
- 美丽的渐变背景
- 漂浮的动画球体
- 玻璃形态卡
- 自动播放动画
- 无代码块-全可视化
- 最后一张幻灯片上的循环演示
- 响应式设计
- 触摸/滑动支持
技术栈
- 反应18
- 维特
- Framer Motion
- TypeScript