影视在线 CMS 系统
项目简介
影视在线 CMS 系统是一个完整的视频网站解决方案，包含前端网站、管理后台和API服务三个模块。该系统支持视频管理、文章管理、分类管理等功能，为用户提供优质的视频观看体验。
技术栈
前端网站 (web)
- 框架: Vue 3 + TypeScript
- 构建工具: Vite
- 样式: TailwindCSS
- 状态管理: Pinia
- 路由: Vue Router
- HTTP客户端: Axios
- 视频播放器: XGPlayer
管理后台 (admin)
- 框架: React + TypeScript
- UI组件库: Ant Design
- 富文本编辑器: WangEditor
- 视频播放器: XGPlayer
- HTTP客户端: Axios
API服务 (api)
- 运行环境: Cloudflare Workers
- 语言: TypeScript
- 数据库: Cloudflare D1
功能介绍
前端网站
- 首页: 轮播推荐视频、分类视频列表、排行榜
- 电影页: 电影分类浏览、分页加载、搜索功能
- 详情页: 视频播放、剧集选择、相关推荐
- 搜索功能: 支持关键词搜索、下拉建议
- 主题切换: 支持亮色/暗色主题
- 用户系统: 登录注册功能
管理后台
- 视频管理: 视频上传、编辑、删除、推荐设置
- 文章管理: 文章发布、编辑、删除
- 分类管理: 分类创建、编辑、排序
- 标签管理: 标签创建、编辑
- 用户管理: 用户权限管理
API服务
- 视频接口: 视频列表、详情、推荐
- 文章接口: 文章列表、详情
- 分类接口: 分类列表、排序
- 搜索接口: 支持关键词搜索
- 用户接口: 登录、注册
本地启动
前置条件
- Node.js 18.0.0+
- npm 9.0.0+
- Cloudflare Workers CLI (wrangler)
启动步骤
1. 启动 API 服务
cd api
npm install
npm run dev
2. 启动管理后台
cd admin
npm install
npm run dev
3. 启动前端网站
cd web
npm install
npm run dev
生产发布
API 服务
cd api
npm run deploy
管理后台
cd admin
npm run build
# 将 dist 目录部署到静态网站托管服务
前端网站
cd web
npm run build
# 将 dist 目录部署到静态网站托管服务
开源代码贡献
贡献流程
- Fork 本仓库
- 创建特性分支 (
git checkout -b feature/amazing-feature) - 提交更改 (
git commit -m 'Add some amazing feature') - 推送到分支 (
git push origin feature/amazing-feature) - 打开 Pull Request
代码规范
- 前端: 遵循 ESLint 规则
- API: 遵循 TypeScript 最佳实践
- 提交信息: 清晰描述更改内容
开发建议
- 提交代码前确保所有测试通过
- 为新功能添加适当的测试
- 保持代码风格一致
- 提供详细的代码注释
项目结构
byt.cms/
├── admin/ # 管理后台
│ ├── src/ # 源代码
│ └── package.json # 依赖配置
├── api/ # API服务
│ ├── src/ # 源代码
│ └── wrangler.toml # Cloudflare配置
├── web/ # 前端网站
│ ├── src/ # 源代码
│ └── package.json # 依赖配置
└── README.md # 项目文档
许可证
MIT License
联系方式
如有问题或建议，请通过 GitHub Issues 提出。(github.com/boycot2015/…)
