MCP Intro Vibe

MCP问题跟踪器

使用React、Fastify、SQLite和BetterAuth构建的全栈问题跟踪应用程序。

特性

• 用户认证：使用BetterAuth注册、登录和会话管理
• 问题管理：创建、阅读、更新和删除问题
• 筛选和搜索：按状态、受让人、标签筛选问题，并按文本搜索
• 标签：使用颜色编码标签组织问题
• 用户分配：将问题分配给团队成员
• 优先级：设定问题优先级（低、中、高）
• 状态跟踪：跟踪问题进度（未开始、正在进行、已完成）
• 响应式设计：适用于台式机和移动设备

技术栈

后端

• 禁食：快速高效的Node.js web框架
• BetterAuth：现代身份验证库
• 数据库：轻量级数据库（通过better-sxlite3）
• Node.js：JavaScript运行时

前端

• 反应：UI库
• 维特：构建工具和开发服务器
• React路由器：客户端路由
• Tailwind CSS：实用程序优先的CSS框架
• shadcn/ui：UI组件库
• 阿西奥斯：HTTP客户端
• 松纳：吐司通知

先决条件

• Node.js 18或更高版本
• npm或纱线

安装

1. 克隆存储库：

git clone 
cd mcp-intro-vibe

1. 安装后端依赖项：

cd backend
npm install

1. 安装前端依赖项：

cd ../frontend
npm install

1. 初始化数据库：

cd ../backend
npm run init-db

运行应用程序

启动后端

cd backend
npm run dev

后端API将在 http://localhost:3000

启动前端

在新终端中：

cd frontend
npm run dev

前端将在 http://localhost:5173

API终点

认证

• POST /api/auth/sign-up/email -创建新帐户
• POST /api/auth/sign-in/email -登录帐户
• POST /api/auth/sign-out -退出
• GET /api/auth/get-session -获取当前会话

问题

• GET /api/issues -列出问题（带过滤）
• POST /api/issues -创建新问题
• GET /api/issues/:id -按ID获取问题
• PUT /api/issues/:id -更新问题
• DELETE /api/issues/:id -删除问题

标签

• GET /api/tags -列出所有标签
• POST /api/tags -创建新标签
• DELETE /api/tags/:id -删除标签

用户

• GET /api/users -列出所有用户

健康

• GET /health -详细的健康状况
• GET /health/ready -准备就绪探针
• GET /health/live -活体探针

环境变量

后端（.env）

NODE_ENV=development
PORT=3000
BETTER_AUTH_SECRET=your-secret-key-change-in-production
BETTER_AUTH_URL=http://localhost:3000

数据库模式

该应用程序使用SQLite和以下主表：

• 用户：用户帐户（由BetterAuth管理）
• 会话：用户会话（由BetterAuth管理）
• 问题：问题跟踪
• 标签：问题标签/标签
• issue_tag：问题和标签之间的多对多关系

项目结构

mcp-intro-vibe/
├── backend/
│   ├── src/
│   │   ├── db/
│   │   │   ├── connection.js
│   │   │   ├── init.js
│   │   │   └── schema.js
│   │   ├── middleware/
│   │   │   ├── auth.js
│   │   │   └── error.js
│   │   ├── routes/
│   │   │   ├── health.js
│   │   │   ├── issues.js
│   │   │   ├── tags.js
│   │   │   └── users.js
│   │   ├── utils/
│   │   │   └── validation.js
│   │   ├── auth.js
│   │   └── index.js
│   ├── database.sqlite
│   ├── package.json
│   └── .env
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   │   ├── ui/
│   │   │   │   ├── badge.jsx
│   │   │   │   ├── button.jsx
│   │   │   │   ├── card.jsx
│   │   │   │   ├── input.jsx
│   │   │   │   ├── label.jsx
│   │   │   │   ├── select.jsx
│   │   │   │   └── textarea.jsx
│   │   │   ├── Layout.jsx
│   │   │   ├── ProtectedRoute.jsx
│   │   │   ├── StatusBadge.jsx
│   │   │   ├── TagBadge.jsx
│   │   │   └── UserAvatar.jsx
│   │   ├── contexts/
│   │   │   └── AuthContext.jsx
│   │   ├── lib/
│   │   │   ├── api.js
│   │   │   └── utils.js
│   │   ├── pages/
│   │   │   ├── CreateIssuePage.jsx
│   │   │   ├── EditIssuePage.jsx
│   │   │   ├── HomePage.jsx
│   │   │   ├── IssueDetailPage.jsx
│   │   │   ├── IssuesPage.jsx
│   │   │   ├── SignInPage.jsx
│   │   │   └── SignUpPage.jsx
│   │   ├── App.jsx
│   │   ├── index.css
│   │   └── main.jsx
│   ├── index.html
│   ├── package.json
│   ├── vite.config.js
│   ├── tailwind.config.js
│   └── postcss.config.js
├── API.md
├── INSTRUCTIONS.md
├── TASKS.md
├── package.json
└── README.md

用法

1. 创建账户：参观 http://localhost:5173 然后单击“注册”
2. 登录：使用您的凭据登录
3. 创建问题：单击“新问题”创建您的第一个问题
4. 用标签组织：添加标签以对问题进行分类
5. 分配工作：将问题分配给团队成员
6. 跟踪进度：随着工作的进展更新问题状态
7. 筛选和搜索：使用筛选器查找特定问题

发展

后端开发

后端使用Node.js --watch 自动重新加载标志：

npm run dev

前端开发

前端使用Vite的热模块替换：

npm run dev

数据库管理

要重置数据库，请执行以下操作：

cd backend
rm database.sqlite
npm run init-db

生产建设

后端

cd backend
npm start

前端

cd frontend
npm run build
npm run preview

构建的文件将位于 frontend/dist/.

安全注意事项

• 改变 BETTER_AUTH_SECRET 生产中
• 在生产环境中使用HTTPS
• 配置适当的CORS源
• 对生产使用实施限速
• 定期安全审计和依赖关系更新

贡献

1. 分叉存储库
2. 创建要素分支
3. 进行更改
4. 彻底测试
5. 提交拉取请求

许可证

国际学生委员会

支持

有关问题和疑问，请在GitHub上打开问题。