應用程式已上線並運行於
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 查看詳細產品
購物車頁面
如果商品數量沒有庫存,則發出警報
最喜歡的產品
刪除收藏的產品
使用產品名稱搜尋最喜歡的產品
訂購產品
追蹤訂單
查看訂單詳情