精仿小米商城，基于Next.js 15 + React 19 + TypeScript。
👉 项目地址：
- ✅ 使用 Next.js App Router 最新架构，服务端渲染
- ✅ 使用 React 19 新特性（如
useActionState,useOptimistic,useTransition,use等提升开发体验和用户体验） - ✅ 部分页面支持 深色/浅色/自适应主题
- ✅ 部分页面支持 多语言切换+
RTL - ✅
WebSocket支付成功模拟 - ✅
Redis+BullMQ实现超时订单自动取消 - ✅ 使用
Drizzle ORM操作 MySQL 数据库 - ✅ 部分动画使用
motion - ✅ 样式使用
tailwindcss - ✅ 前后端异步交互使用Next.js内部
RPC协议
- 用户注册、登录、找回密码
- 登录方式：密码登录、短信验证码登录
- 修改个人信息、修改密码
- 账号安全、收藏商品、地址管理
- 首页、搜索页
- 商品详情页
- 商品参数、评论展示
- 商品购买页
- 购物车、结算页、支付页
- 订单列表、订单详情、订单评价
- 超时订单自动取消（Redis + BullMQ）
- WebSocket 模拟支付成功通知
- 视频列表页
- 部分页面国际化支持
- 部分页面主题切换（亮 / 暗 / 自适应）等
| 类别 | 技术栈 |
|---|---|
| 前端框架 | Next.js 15+ (App Router) |
| 前端库 | React 19 |
| 样式 | Tailwind CSS, Motion |
| 数据库 | MySQL + Drizzle ORM |
| 消息队列 | Redis + BullMQ |
| 实时通信 | WebSocket |
| 国际化 | next-intl |
| 认证 | next-auth |
git clone https://github.com/chengdongqing/mishop-next.git
cd mishop-nextnpm install
# 或
yarn install创建 .env.local 文件，并填写如下内容：
DATABASE_URL=mysql://root:yourpassword@localhost:3306/mishop
REDIS_URL=redis://localhost:6379
AUTH_SECRET=N43vXS1P9zIWLeU24pjIPusmY99LqmAFcYS9RqiL7w8=
AUTH_TRUST_HOST=http://localhost:3000
PAYMENT_TIMEOUT=30# macOS / Linux
openssl rand -base64 32
# Windows 用户可访问：https://generate-secret.vercel.app/32# MySQL
docker run --name mysql \
-e MYSQL_ROOT_PASSWORD=yourpassword \
-p 3306:3306 \
-d mysql
# Redis
docker run --name redis -p 6379:6379 -d redisnpm run dev
# 或
yarn devnpm run dev:all
# 或
yarn dev:all-
手动创建数据库，并命名为
mishop -
访问 http://localhost:3000/seed 初始化数据，调用此接口会直接创建数据库表+填充初始数据，注意此操作会影响已存在的数据。
npm run build运行生产版本
npm run start
# 或
npm run start:all构建后页面响应速度将大幅提升
- 🔍 搜索功能未使用全文索引或搜索引擎（如 ElasticSearch）
- 🌐 页面静态化（SSG）后无法动态响应主题 / 语言切换
- 💰 支付/发送验证码仅为模拟流程
- 还有若干问题待优化
欢迎大家提Bug或建议（Issue）、补充新功能、增强用户体验等
欢迎通过以下方式与我联系交流项目问题或技术经验：
- 📧 邮箱：1912525497@qq.com
- 🐙 GitHub：https://github.com/chengdongqing
- 📘 掘金：@海盐芝士不加糖
如果你喜欢这个项目，欢迎 Star ⭐、Fork 🍴、提 Issue 🐛，你的支持是我持续优化的动力！