应用程序已上线并运行于
https://nextjs-ecommerce-typescript.vercel.app/
作者
特征
笔记
- 仅当您克隆时,您才能访问管理仪表板,您无法注册管理员帐户我添加了虚拟产品和类别
多用户登录系统
- 登录/注册 ✔
- 忘记密码✔
- 对每个授权请求进行 JWT 验证 ✔
- 管理员访问和客户访问的授权验证 ✔
管理面板
- 添加产品✔
- 查看产品 ✔
- 删除产品 ✔
- 更新产品✔
- 添加类别✔
- 查看类别(数据表)✔
- 更新类别✔
- 删除类别✔
- 按名称搜索类别 ✔
- 按类别搜索产品 名称 ✔
- 处理订单交付✔
- 待处理订单列表 ✔
- 已完成的订单清单✔
顾客
- 查看产品和类别 ✔
- 查看与特定类别相关的产品✔
- 使用 breadcamp 查看动态页面详细信息✔
- 将产品添加到购物车✔
- 从购物车中删除产品✔
- 增加减少购物车商品数量✔(如果产品库存数量少于您的购物车数量,则您无法增加该产品数量)
- 如果库存数量不足,则发出警报 ✔
- 为最喜欢的产品添加书签 ✔
- 从书签中删除产品✔
- 订购产品✔
- 创建订单后,当前用户购物车中存在的产品将被清除 ✔
- 跟踪订单状态 ✔
- 查看订单详情✔
笔记
随着时间的推移将添加更多功能
科技
- 下一个js 13
- 打字稿
- 顺风 CSS
- Redux 工具包
- 连接验证
- 蒙古数据库
- 用于获取 API 的 SWR 挂钩
环境变量
要运行此项目,您需要将以下环境变量添加到 .env 文件中
DB_URI
= 您的 mongoDB URL
JWT_SECREAT
= 您的自定义 JWT_SECREAT 密钥
NEXT_PUBLIC_API_BASE_URL
= 本地主机的基本 URL => http://localhost:3000
安装
使用 npm 安装 my-project
npm install
npm run dev (for development server)
npm run build (for Production)
npm run preview (To View Production Server )
屏幕截图
管理仪表板
管理员添加产品
管理员添加类别
管理员查看类别
管理员查看产品
管理员搜索具有类别名称的产品
管理员搜索带有类别名称的类别
待处理订单列表
已完成的订单清单
登陆页面
使用 Dynamic Breadcamp 查看特定类别的产品
使用 Dynamic Breadcamp 查看详细产品
购物车页面
如果商品数量没有库存,则发出警报
最喜欢的产品
删除收藏的产品
使用产品名称搜索最喜欢的产品
订购产品
追踪订单
查看订单详情