由壹点3D素材
一个现代化的3D素材分享平台,采用苹果官方UI设计规范。
技术栈
- 前端: Next.js 14 + React 18 + TypeScript + TailwindCSS
- 认证: NextAuth.js
- 数据库: PostgreSQL + Prisma ORM
- 存储: MinIO S3 (预览图) + 本地存储 (压缩包)
功能特性
- ✅ 用户注册/登录系统
- ✅ 素材上传(预览图 + 压缩包)
- ✅ 素材浏览与下载
- ✅ 管理员后台管理
- ✅ 用户管理
- ✅ 苹果风格UI设计
快速开始
1. 安装依赖
npm install
2. 配置环境变量
复制 .env.local 文件并填入你的配置:
# Database
DATABASE_URL=your_postgresql_url
# NextAuth
NEXTAUTH_SECRET=your_secret_key
NEXTAUTH_URL=http://localhost:3000
# MinIO S3 Storage
S3_ENDPOINT=your_s3_endpoint
S3_BUCKET=your_bucket_name
S3_ACCESS_KEY_ID=your_access_key
S3_SECRET_ACCESS_KEY=your_secret_key
S3_REGION=us-east-1
S3_PUBLIC_DOMAIN=your_public_domain
S3_FILE_PATH=your_file_path/
# Local storage
UPLOAD_DIR=./uploads
3. 初始化数据库
# 生成 Prisma Client
npm run prisma:generate
# 推送数据库模式
npm run prisma:push
4. 创建管理员账号
首次运行后,注册一个账号,然后在数据库中手动将该用户的 role 字段设置为 ADMIN。
UPDATE users SET role = 'ADMIN' WHERE email = 'your@email.com';
5. 启动开发服务器
npm run dev
项目结构
gongxiangp2/
├── app/ # Next.js App Router
│ ├── api/ # API 路由
│ │ ├── auth/ # 认证相关
│ │ ├── materials/ # 素材相关
│ │ └── admin/ # 管理员相关
│ ├── login/ # 登录页面
│ ├── register/ # 注册页面
│ ├── admin/ # 管理员页面
│ └── page.tsx # 首页
├── components/ # React 组件
│ ├── Header.tsx
│ └── UploadModal.tsx
├── lib/ # 工具库
│ ├── prisma.ts # Prisma 客户端
│ ├── auth.ts # NextAuth 配置
│ └── s3.ts # S3 存储服务
├── prisma/ # Prisma 配置
│ └── schema.prisma # 数据库模式
└── uploads/ # 本地上传文件存储
数据库模型
User (用户)
- id: UUID
- email: 邮箱
- username: 用户名
- password: 密码 (加密)
- role: 角色 (USER/ADMIN)
Material (素材)
- id: UUID
- previewUrl: 预览图URL (S3)
- productModel: 商品型号
- sceneName: 场景名称
- authorName: 作者花名
- zipFileName: 压缩包文件名
- zipFilePath: 压缩包本地路径
- userId: 用户ID (外键)
部署
生产环境构建
npm run build
npm start
环境变量
确保在生产环境中设置所有必要的环境变量,特别是:
NEXTAUTH_SECRET: 使用强随机字符串NEXTAUTH_URL: 设置为生产域名
License
MIT
Description
Languages
TypeScript
91.4%
JavaScript
3.8%
PowerShell
2.9%
Python
1.2%
PLpgSQL
0.3%
Other
0.4%