使用说明

🌌 裂隙

通过操作复杂性产生裂痕

由DigitalOcean Graduate AI+模型上下文协议支持的自主基础设施编排和修复。

这是一个Vibe编码的项目，我只是在黑客马拉松周末玩得很开心，因为我喜欢这个想法。

打开裂缝以创造，闭合裂缝以修复——所有这些都以机器速度进行。

📋 目录

什么是Rift？
项目结构
前端设置
后端设置
运行完整系统
设计系统
演示指南
建筑
技术栈

🎯 什么是Rift？

Rift是一个基于人工智能的基础设施编排器 自主检测、诊断和修复基础设施问题 使用多代理系统和模型上下文协议（MCP）。

问题

DevOps工程师花费 40%的时间 关于常规基础设施事故
平均事件响应时间： 2-4小时
手动修复容易出错且不一致
随叫随到的疲劳会导致倦怠

解决方案

FixBot使用三个专门的AI代理：

监视器代理 -通过DigitalOcean MCP+Prometheus在几秒钟内检测问题
诊断代理 -使用RAG从知识库中分析根本原因
补救剂 -通过Terraform+MCP自动修复问题

结果： 事件响应时间从数小时缩短到 约90秒，完全自主。

📁 项目结构

fixbot/
│
├── frontend/                    # 🎨 Next.js Dashboard (Pre-built)
│   ├── app/
│   │   ├── page.tsx            # Main dashboard
│   │   ├── layout.tsx          # Root layout
│   │   ├── globals.css         # Dark punk theme styles
│   │   └── favicon.ico
│   │
│   ├── components/
│   │   ├── ui/                 # shadcn/ui components
│   │   │   ├── button.tsx
│   │   │   ├── card.tsx
│   │   │   └── badge.tsx
│   │   │
│   │   ├── StatusCard.tsx      # Agent status display
│   │   ├── IncidentFeed.tsx    # Real-time event stream
│   │   ├── AgentStatus.tsx     # Agent health monitor
│   │   ├── MetricsChart.tsx    # System metrics visualization
│   │   ├── TraceViewer.tsx     # AI decision traceability
│   │   └── Terminal.tsx        # Terminal-style output
│   │
│   ├── lib/
│   │   ├── api.ts              # Backend API client
│   │   ├── websocket.ts        # WebSocket connection
│   │   └── utils.ts            # Utility functions
│   │
│   ├── public/
│   │   └── fixbot-logo.svg
│   │
│   ├── package.json
│   ├── tsconfig.json
│   ├── tailwind.config.ts      # Dark punk theme
│   ├── next.config.js
│   ├── .env.local              # Configure this!
│   └── README.md
│
└── backend/                     # 🔧 Python Backend (Build this!)
    ├── agents/
    │   ├── base_agent.py       # Base agent class
    │   ├── monitor_agent.py    # Monitoring logic
    │   ├── diagnostic_agent.py # Diagnosis with RAG
    │   └── remediation_agent.py # Auto-remediation
    │
    ├── mcp_clients/
    │   ├── do_mcp.py           # DigitalOcean MCP
    │   ├── terraform_mcp.py    # Terraform MCP
    │   └── prometheus_mcp.py   # Custom Prometheus MCP
    │
    ├── orchestrator/
    │   └── coordinator.py      # Agent coordination
    │
    ├── models/
    │   └── incident.py         # Pydantic models
    │
    ├── terraform/
    │   ├── main.tf
    │   └── modules/
    │
    ├── demo/
    │   └── failure_injection.py # Demo scenarios
    │
    ├── knowledge-base/
    │   ├── do-docs.md
    │   ├── runbooks.md
    │   └── past-incidents.json
    │
    ├── main.py                 # FastAPI backend
    ├── requirements.txt
    ├── .env                    # Configure this!
    └── README.md

目录职责

前端(fixbot/frontend/):

✅ 预构建并随时可用 -快跑 npm install 并配置 .env.local
Next.js 14+，带应用路由器
带有WebSocket更新的实时仪表板
Dark Punk专业主题 -赛博朋克美学与彭博终端相遇
TypeScript+顺风CSS+shadcn/ui
所需配置最少

后端(fixbot/backend/):

⚠️ 你在黑客马拉松期间建造了这个
Python快速API应用程序
AI代理（监控、诊断、补救）
MCP服务器集成
用于实时更新的WebSocket服务器
基础设施即代码（Terraform）

🎨 前端设置

前端是预建以专业的黑暗朋克为主题。你只需要安装和配置它。

先决条件

Node.js 18+和npm 9+
正在运行的后端API（请参阅后端设置）

快速开始

# Navigate to frontend directory
cd fixbot/frontend

# Install dependencies
npm install

# Configure environment variables
cp .env.example .env.local

编辑 .env.local:

# Backend API endpoint
NEXT_PUBLIC_API_URL=http://localhost:8000

# WebSocket endpoint
NEXT_PUBLIC_WS_URL=ws://localhost:8000/ws

# Run development server
npm run dev

# Open browser
open http://localhost:3000

前端技术栈

框架： Next.js 14（应用路由器）
语言： TypeScript
造型： Tailwind CSS
组件： shadcn/ui
国家： React挂钩
实时： WebSocket客户端
API客户： 获取带有错误处理的API

🔧 后端设置

后端是你将在黑客马拉松期间构建的东西。

先决条件

Python 3.11+
使用API令牌的DigitalOcean帐户
渐变AI平台访问
Terraform已安装
Docker（用于MCP服务器）

快速开始

# Navigate to backend directory
cd fixbot/backend

# Create virtual environment
python3 -m venv venv
source venv/bin/activate  # Windows: venv\Scripts\activate

# Install dependencies
pip install -r requirements.txt

# Configure environment variables
cp .env.example .env

编辑 .env:

# DigitalOcean
DO_API_TOKEN=your_do_token_here
DO_SPACES_KEY=your_spaces_key
DO_SPACES_SECRET=your_spaces_secret

# Gradient AI
GRADIENT_AI_API_KEY=your_gradient_key
MONITOR_AGENT_ID=agent_xxx
DIAGNOSTIC_AGENT_ID=agent_yyy
REMEDIATION_AGENT_ID=agent_zzz

# MCP Servers
DO_MCP_URL=http://localhost:3000
TERRAFORM_MCP_URL=http://localhost:3001
PROMETHEUS_URL=http://your-prometheus:9090

# Start MCP servers (in separate terminals)
# See MCP Integration section in full guide

# Run FastAPI backend
python main.py

# Backend should start on http://localhost:8000

后端技术栈

框架： 快速API
人工智能平台： 数字海洋梯度AI
协议： 模型上下文协议（MCP）
IaC： 地形
监控： 普罗米修斯
语言： Python 3.11+

🚀 运行完整系统

开发模式

终端1：后端API

cd fixbot/backend
source venv/bin/activate
python main.py
# Runs on http://localhost:8000

终端2：前端仪表板

cd fixbot/frontend
npm run dev
# Runs on http://localhost:3000

终端3：监控日志（可选）

cd fixbot/backend
tail -f logs/fixbot.log

验证一切正常

# Check backend health
curl http://localhost:8000/agents/health

# Check frontend loads
curl http://localhost:3000

# Open dashboard in browser
open http://localhost:3000  # macOS
xdg-open http://localhost:3000  # Linux

您应该看到：

✅ 所有三个代理状态卡均显示“活动”，并带有绿色指示灯
✅ 显示正常值的系统指标
✅ 实时连接指示灯显示“已连接”
✅ 空事件提要（尚未发生事件）

🎨 设计系统（Dark Punk专业主题）

主题哲学

“职业赛博朋克” -高科技运营中心的美学。思考： 《银翼杀手》与彭博终端相遇深色、光滑，带有霓虹色调，传达出紧迫感和精确性。

调色板

/* Background & Surfaces */
--background: #0a0e17; /* Deep space black */
--surface: #111827; /* Card/panel background */
--surface-elevated: #1f2937; /* Elevated elements */

/* Brand Colors (Neon Accents) */
--primary: #00ff9f; /* Neon green - success/active */
--secondary: #00d4ff; /* Cyber blue - info */
--accent: #ff00ff; /* Neon magenta - alerts */

/* Status Colors */
--success: #00ff9f; /* Neon green */
--warning: #ffaa00; /* Electric amber */
--danger: #ff3366; /* Hot pink red */

/* Text */
--text-primary: #e5e7eb; /* Almost white */
--text-secondary: #9ca3af; /* Muted gray */
--text-muted: #6b7280; /* Very muted */

/* Borders */
--border: #1f2937; /* Subtle borders */
--border-bright: #374151; /* Highlighted borders */

排版

字体：

标题： "JetBrains Mono" 或 "Space Mono" （单空间，技术感）
主体： "Inter" 或 "DM Sans" （干净、可读）
代码/终端： "Fira Code" 或 "Cascadia Code" （用绑带）

指导方针：

使用 大写字母 用于标签和状态指示器
使用 等宽字体 适用于任何技术（ID、时间戳、指标）
使用 大中型 重要信息（记住：投影仪演示！）
使用颜色传达意义（绿色=良好，红色=关键，蓝色=信息）

组件示例

状态卡（代理显示）

<Card className="bg-[#111827] border border-[#1f2937] hover:border-[#00ff9f] transition-all">
  <div className="flex items-center gap-3">
    {/* Active indicator - pulsing green dot */}
    <div className="h-2 w-2 rounded-full bg-[#00ff9f] animate-pulse" />

    {/* Agent name - monospace, uppercase, neon green */}
    <span className="text-[#00ff9f] font-mono uppercase tracking-wider">
      Monitor Agent
    </span>
  </div>

  {/* Status info - secondary text */}
  <div className="mt-2 text-[#9ca3af] text-sm">
    Status: Active • Last check: 2s ago
  </div>
</Card>

终端/控制台输出

<div className="bg-black border border-[#00ff9f] rounded p-4 font-mono">
  <div className="flex gap-2 text-[#00ff9f]">
    <span className="text-[#00ff9f]">●</span>
    <span>14:32:15 | FixBot detected high CPU (95%)</span>
  </div>
  <div className="flex gap-2 text-[#00d4ff]">
    <span className="text-[#00d4ff]">●</span>
    <span>14:32:18 | Analyzing root cause...</span>
  </div>
  <div className="flex gap-2 text-[#00ff9f]">
    <span className="text-[#00ff9f]">●</span>
    <span>14:33:45 | ✅ RESOLVED - Droplet resized</span>
  </div>
</div>

指标显示

<div className="space-y-2">
  <div className="flex justify-between text-sm">
    <span className="text-[#9ca3af]">CPU Usage</span>
    <span className="text-[#00ff9f] font-mono">42%</span>
  </div>

  {/* Progress bar with gradient */}
  <div className="h-2 bg-[#1f2937] rounded-full overflow-hidden">
    <div
      className="h-full bg-gradient-to-r from-[#00ff9f] to-[#00d4ff]"
      style={{ width: "42%" }}
    />
  </div>
</div>

动画指南

谨慎而专业地使用：

/* Pulse for active states */
@keyframes pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
}

/* Glow effect on hover */
.hover-glow:hover {
  box-shadow: 0 0 20px rgba(0, 255, 159, 0.3);
}

/* Subtle scan line (optional) */
@keyframes scan {
  0% {
    transform: translateY(-100%);
  }
  100% {
    transform: translateY(100%);
  }
}

做：

✅ 活动/活动状态的脉冲指示器
✅ 平滑过渡（0.2-0.3秒）
✅ 悬停效果（发光、边框颜色更改）
✅ 通知淡入/淡出

不要：

❌ 动画过多
❌ 持续运动
❌ 演示期间的分心效果
❌ 闪烁的过渡

布局原则

仪表板网格（桌面）：

┌─────────────────────────────────────────────────┐
│  🤖 FixBot                        [●] LIVE     │
├─────────────────────────────────────────────────┤
│                                                 │
│  [Monitor]  [Diagnostic]  [Remediation]        │  ← Agent status cards
│                                                 │
├─────────────────────────────────────────────────┤
│                                                 │
│  📊 System Metrics                              │  ← Metrics display
│  CPU | Memory | Disk                            │
│                                                 │
├─────────────────────────────────────────────────┤
│                                                 │
│  🔴 Live: Incident Timeline                     │  ← Real-time feed
│  [Scrolling event stream...]                    │
│                                                 │
└─────────────────────────────────────────────────┘

间距：

使用 gap-4 （1rem）或 gap-6 （1.5雷姆）
卡片内部填充物丰富： p-6 或 p-8
一致的利润率： my-4 或 my-6

🎬 演示指南

演示前检查表

演示前5分钟：

启动后端：
```
cd fixbot/backend && python main.py
```
启动前端：
```
cd fixbot/frontend && npm run dev
```
打开仪表板：
```
open http://localhost:3000
```
验证状态：
- 所有代理均显示绿色“活动”
- 系统指标显示正常
- 实时指示器显示“已连接”

准备故障注入：

cd fixbot/backend/demo
# Have terminal ready with injection command

演示脚本（7分钟）

[0:00-0:30]挂钩+仪表板简介

YOU: "Infrastructure breaks. That's a fact of life.

But what if you had a bot that fixed things automatically -
before they wake up your on-call engineer at 3 AM?

That's FixBot."

[Show dashboard on screen - point to it]

"This is FixBot's operations center.
Three AI agents monitoring our infrastructure 24/7."

[0:30-1:00]建筑详解

[Point to each agent card]

YOU: "Three specialized agents:

Monitor Agent - detects issues via DigitalOcean MCP and Prometheus
Diagnostic Agent - uses RAG to analyze root causes
Remediation Agent - fixes problems automatically via Terraform

All powered by DigitalOcean Gradient AI with Model Context Protocol."

[1:00-4:00]现场演示：CPU峰值

# Run in terminal (don't show this to judges, just run it)
python failure_injection.py --inject cpu --target web-app

[FOCUS ON DASHBOARD - this is the star]

YOU: "Let me trigger a real incident. I'm overloading our web server..."

[Dashboard comes alive:]
- Monitor Agent: Status changes to "⚠ DETECTING..."
- Incident feed starts scrolling:
  "14:32:15 | 🔴 ALERT: High CPU detected (95%)"

[CPU metric bar turns red, shows 95%]

YOU: "Three seconds. FixBot detected it."

[Diagnostic Agent activates:]
  "14:32:18 | 🔍 Analyzing root cause..."
  "14:32:22 | 💡 Root cause: Undersized droplet"
  "14:32:22 | 📋 Recommended: Resize to s-2vcpu-4gb"

YOU: "Now it's using RAG - querying our knowledge base of past incidents,
DigitalOcean documentation, best practices..."

[Remediation Agent executes:]
  "14:32:25 | 🔧 Executing: Terraform resize"
  "14:32:30 | ⚙️  Applying infrastructure changes..."
  "14:33:45 | ✅ RESOLVED: Droplet resized"

[CPU drops to 42%, turns green]
[All agents return to "Active" status]

YOU: "90 seconds total. From detection to resolution.
Completely autonomous. No human intervention."

[Pause for impact]

[4:00-5:00]显示可追溯性

[Click on resolved incident in feed]
[Opens trace viewer panel]

YOU: "Here's what makes this special - full traceability.

[Point to trace view showing:]
- Input metrics and system state
- RAG retrieval results from knowledge base
- Decision logic and confidence scores
- Terraform config generated
- Success validation

"Every decision the AI makes is auditable.
This isn't a black box. You can see exactly why FixBot chose this solution."

[5:00-6:00]快速第二次演示（如果时间）

python failure_injection.py --inject disk --target api-server

YOU: "One more. Disk full on API server..."

[Faster walkthrough on dashboard]
- Detect (5s)
- Diagnose (15s)
- Attach new volume (45s)
- Resolved

YOU: "Same pattern. Different problem. Fixed automatically."

[6:00-7:00]结束

[Return to clean dashboard - all green]

YOU: "FixBot - the infrastructure fixer that never sleeps.

Key features:
• Detects issues in seconds using DigitalOcean MCP
• Diagnoses with AI-powered RAG
• Fixes automatically via Terraform
• Full traceability of every decision
• Built entirely on DigitalOcean Gradient AI

This is the future of infrastructure management.
No more 3 AM wake-up calls.
No more manual emergency fixes.
Just autonomous, intelligent infrastructure.

Questions?"

[Confident smile, pause]

演示技巧

做：

✅ 演示期间保持仪表板全屏显示
✅ 说话缓慢而清晰
✅ 在关键影响点后暂停
✅ 在解释时指向屏幕元素
✅ 表现出热情——这是很酷的技术！
✅ 如果现场演示失败，请备份视频

不要：

❌ 不断在终端和浏览器之间切换
❌ 快速浏览演示
❌ 迷失在技术细节中
❌ 为延误道歉（这很正常）
❌ 背对着观众

🏗️ 建筑

┌──────────────────────────────────────────────────────────────┐
│                     USER INTERFACE                           │
│                  (Next.js Dashboard)                         │
│                                                              │
│  • Dark Punk Professional Theme                              │
│  • Real-time WebSocket Updates                               │
│  • Agent Status Monitoring                                   │
│  • Incident Timeline                                         │
│  • Decision Traceability                                     │
└────────────────┬────────────────────────────────────────────┘
                 │
                 │ WebSocket + REST API
                 │
┌────────────────▼────────────────────────────────────────────┐
│                  FASTAPI BACKEND                             │
│                  (Orchestrator)                              │
│                                                              │
│  Endpoints:                                                  │
│  • POST /incidents/detect                                    │
│  • POST /incidents/diagnose                                  │
│  • POST /incidents/remediate                                 │
│  • GET /status                                               │
│  • GET /agents/health                                        │
│  • WS /ws (WebSocket for real-time)                          │
└────────────────┬────────────────────────────────────────────┘
                 │
                 │ Agent API Calls
                 │
┌────────────────▼────────────────────────────────────────────┐
│         DIGITALOCEAN GRADIENT AI PLATFORM                    │
│              (Multi-Agent System)                            │
│                                                              │
│  ┌──────────┐  ┌──────────────┐  ┌────────────────┐       │
│  │ MONITOR  │──│ DIAGNOSTIC   │──│ REMEDIATION    │       │
│  │ AGENT    │  │ AGENT        │  │ AGENT          │       │
│  │          │  │              │  │                │       │
│  │ • Detect │  │ • RAG Query  │  │ • Terraform    │       │
│  │ • Alert  │  │ • Analyze    │  │ • DO API       │       │
│  │ • Triage │  │ • Recommend  │  │ • Validate     │       │
│  └────┬─────┘  └──────┬───────┘  └────────┬───────┘       │
│       │               │                    │                │
│       └───────────────┼────────────────────┘                │
│                       │                                     │
│  ┌────────────────────▼─────────────────────────────────┐  │
│  │         KNOWLEDGE BASE (RAG)                         │  │
│  │  • DO Documentation (auto-indexed)                   │  │
│  │  • Runbooks & Best Practices                         │  │
│  │  • Past Incident History                             │  │
│  └──────────────────────────────────────────────────────┘  │
└──────────────────────────────────────────────────────────────┘
                 │
                 │ MCP Protocol
                 │
┌────────────────▼────────────────────────────────────────────┐
│              MCP SERVERS                                     │
│                                                              │
│  ┌─────────────────┐  ┌──────────────┐  ┌──────────────┐  │
│  │ DigitalOcean    │  │ Terraform    │  │ Prometheus   │  │
│  │ MCP Server      │  │ MCP Server   │  │ MCP (Custom) │  │
│  │                 │  │              │  │              │  │
│  │ • Droplets      │  │ • Validate   │  │ • Query      │  │
│  │ • Monitoring    │  │ • Plan       │  │ • Alerts     │  │
│  │ • Spaces        │  │ • Apply      │  │ • Metrics    │  │
│  │ • Kubernetes    │  │ • State      │  │              │  │
│  └─────────────────┘  └──────────────┘  └──────────────┘  │
└──────────────────────────────────────────────────────────────┘

🛠️ 技术栈

前端

框架： Next.js 14（应用路由器）
语言： TypeScript 5+
造型： 顺风CSS 3.4
组件： shadcn/ui
状态管理： React钩子（useState、useEffect、useContext）
实时： Websocket API
HTTP客户端： 获取API
构建工具： 内置Next.js（Turbopack）

后端

框架： FastAPI 0.109+
语言： Python 3.11+
人工智能平台： 数字海洋梯度AI
- 多智能体系统
- RAG（检索增强生成）
- 函数调用
- 代理评估
- 可追溯性
协议： 模型上下文协议（MCP）
基础设施： 地形1.6+
监控： 普罗米修斯
状态管理： DO空间（兼容S3）
Websocket： FastAPI WebSocket支持

基础设施

云：数字海洋
- 液滴（计算）
- 空间（对象存储）
- 托管Kubernetes（可选）
- 监控（内置）
IaC： 地形与DO提供商
编排： FastAPI+异步
监控： 普罗米修斯+节点导出器

🎯 主要特点

✅ 已实施（前端）

带WebSocket的实时仪表板
黑暗朋克专业主题
代理状态监控
实时事件馈送
系统指标可视化
决策可追溯性查看器
响应式布局（以桌面为中心）

🔨 实施（后端-你的工作！）

[]具有DO MCP集成的监控代理
[]RAG诊断试剂
[]含有Terraform的修复剂
[]FastAPI编排器
[]用于实时更新的WebSocket服务器
[]MCP客户端实现
[]知识库设置
[]演示失败注入脚本
[]代理评估

📦 快速命令参考

前端

# Install
npm install

# Dev mode
npm run dev

# Build
npm run build

# Production
npm start

# Type check
npm run type-check

# Lint
npm run lint

后端

# Install
pip install -r requirements.txt

# Run dev
python main.py

# Run with reload
uvicorn main:app --reload

# Run tests
pytest tests/

# Type check
mypy .

🐛 故障排除

前端无法连接到后端

检查 .env.local 有正确 NEXT_PUBLIC_API_URL
验证后端是否在预期端口上运行
检查FastAPI后端的CORS设置
在浏览器控制台中查找错误（F12）

WebSocket连接失败

检查 NEXT_PUBLIC_WS_URL 在 .env.local
验证后端是否存在WebSocket端点
检查防火墙/代理设置
测试： wscat -c ws://localhost:8000/ws

黑暗主题不适用

清除浏览器缓存
检查 globals.css 进口于 layout.tsx
验证Tailwind是否正确处理CSS
跑 npm run dev 具有干净的缓存

代理没有响应

检查后台的Gradient AI API键 .env
验证代理ID是否正确
单独测试代理端点
检查渐变AI仪表板是否有错误

📝 许可证

MIT许可证-有关详细信息，请参阅许可证文件

🏆 专为

MLH+数字海洋人工智能黑客马拉松纽约
2025年12月12日至13日

👥 团队

建于❤️ 和☕ [你的名字]

🔗 链接

问题？发现bug了吗？想贡献吗？
在GitHub上打开一个问题或PR！

🤖 FixBot-破坏东西？我们会在你注意到之前修好它们。 🤖

使用说明

🌌 裂隙

📋 目录

🎯 什么是Rift？

问题

解决方案

📁 项目结构

目录职责

🎨 前端设置

先决条件

快速开始

前端技术栈

🔧 后端设置

先决条件

快速开始

后端技术栈

🚀 运行完整系统

开发模式

验证一切正常

🎨 设计系统（Dark Punk专业主题）

主题哲学

调色板

排版

组件示例

状态卡（代理显示）

终端/控制台输出

指标显示

动画指南

布局原则

🎬 演示指南

演示前检查表

演示脚本（7分钟）

演示技巧

🏗️ 建筑

🛠️ 技术栈

前端

后端

基础设施

🎯 主要特点

✅ 已实施（前端）

🔨 实施（后端-你的工作！）

📦 快速命令参考

前端

后端

🐛 故障排除

前端无法连接到后端

WebSocket连接失败

黑暗主题不适用

代理没有响应

📝 许可证

🏆 专为

👥 团队

🔗 链接

相关 MCP

Kubernetes MCP服务器

多集群Kubernetes管理服务

Ansible AI集成服务器

Jenkins自动化服务器

Kubernetes自然语言控制服务

Kubernetes管理控制台