167c51b20d9765df43cdc64069f98218954f80f7
Minecraft 皮肤管理平台
一个基于 Next.js 构建的现代化 Minecraft 皮肤管理平台,支持皮肤上传、管理、角色创建和 Yggdrasil 认证。
功能特性
- 📤 皮肤上传与管理 - 支持上传、预览和管理多个 Minecraft 皮肤
- 👤 角色中心 - 创建和管理游戏角色,支持多角色切换
- 🔐 外置登录 - 通过拖拽功能实现与 PCL2 等启动器的 Yggdrasil 认证
- 📚 使用教程 - 提供基础教程、Yggdrasil 教程等帮助文档
- 🎨 响应式设计 - 适配桌面和移动设备的现代化界面
- 🌙 暗色模式 - 支持亮色/暗色主题切换
技术栈
- 前端框架: Next.js 14 + React 18
- 类型系统: TypeScript
- 样式方案: Tailwind CSS 4 + Radix UI
- 认证系统: NextAuth.js
- API 调用: Axios
- 图标库: Lucide React
安装与运行
前置要求
- Node.js 20+
- npm 或 yarn
安装步骤
- 克隆项目
git clone [仓库地址]
cd my-app
- 安装依赖
npm install
# 或
yarn install
- 启动开发服务器
npm run dev
# 或
yarn dev
- 构建生产版本
npm run build
npm start
# 或
yarn build
yarn start
项目结构
├── public/ # 静态资源文件
│ ├── skins/ # 皮肤文件存储
│ └── images/ # 其他图片资源
├── src/ # 源代码目录
│ ├── app/ # Next.js App Router
│ │ ├── (auth)/ # 认证相关页面
│ │ ├── api/ # API 路由
│ │ ├── character-center/ # 角色中心页面
│ │ ├── dashboard/ # 皮肤管理仪表盘
│ │ ├── help/ # 帮助文档页面
│ │ ├── skins/ # 皮肤上传和管理
│ │ └── user-home/ # 用户主页
│ ├── components/ # 可复用组件
│ │ ├── Navbar.tsx # 导航栏组件
│ │ ├── auth/ # 认证相关组件
│ │ ├── skins/ # 皮肤相关组件
│ │ └── ui/ # UI 组件库
│ ├── lib/ # 工具函数和 API 调用
│ ├── styles/ # 全局样式和主题
│ └── types/ # TypeScript 类型定义
└── next.config.js # Next.js 配置文件
使用指南
皮肤上传
- 登录平台后,在用户主页点击"上传皮肤"卡片
- 选择符合要求的 PNG 格式皮肤文件
- 上传成功后可在"我的皮肤"中查看和管理
Yggdrasil 认证
- 在用户主页找到"外置登录"卡片
- 拖拽此卡片到 PCL2 等支持 Yggdrasil 认证的启动器
- 启动器将自动完成认证流程
角色管理
- 点击"角色中心"卡片进入角色管理界面
- 可以创建新角色、编辑现有角色信息
- 为不同角色分配不同的皮肤
注意事项
- 皮肤文件必须为 PNG 格式,且符合 Minecraft 皮肤尺寸规范
- 3D 预览功能尚未实现,目前使用 2D 预览
- 部分功能可能需要后端 API 支持,请确保相关接口已正确配置
许可证
贡献指南
欢迎提交 Issue 和 Pull Request!
联系方式
如有问题或建议,请通过以下方式联系我们:
- Email: [项目邮箱]
- GitHub: [项目仓库地址]
Description
Languages
TypeScript
97.9%
CSS
1.5%
JavaScript
0.6%