ecommerce admin nextjs

電子商務管理-nextjs

由於 PlanetScale 取消免費計劃，因此演示網站不再運行。

開始日期：2023 年 7 月 26^日。

描述

具有 Stripe 整合的電子商務管理儀表板是一個強大的 Web 應用程序，旨在簡化和增強電子商務網站的管理。這個綜合儀表板使用Next JS、TypeScript、Tailwind CSS、Shadcn UI、Planet Scale、Prisma、zustand、clerk auth、Cloudinary 和Stripe 等尖端技術開發，為管理員提供了一個強大的工具包，用於監督和優化業務的各個方面。

主要特點

• 管理儀表板允許網站管理員建立、更新和刪除商店資訊。
• 管理員可以有效管理網站主頁上顯示的廣告看板或橫幅。他們可以上傳、更新和刪除促銷橫幅以吸引客戶並突出顯示正在進行的優惠或銷售。
• 透過管理儀表板，管理產品類別、尺寸和顏色變得輕而易舉。管理員可以新增、編輯或刪除類別、尺寸和顏色，使網站能夠有效地組織和展示產品。
• 為了實現前端 Web 應用程式和後端之間的順暢通信，儀表板整合了 API 路由。這確保了產品資訊可以無縫獲取並顯示在面向客戶的網站上。
• 管理儀表板利用 Clerk auth 進行安全身份驗證，確保只有授權人員才能存取和管理敏感資訊。
• 透過 Planet Scale 和 Prisma 集成，該應用程式受益於強大且可擴展的資料庫，能夠處理不斷增長的產品庫存和增加的網站流量。
• 任何電子商務網站的核心在於其產品管理功能。管理儀表板使管理員能夠新增產品、更新現有產品、存檔缺貨產品、將產品標記為特色產品以及刪除不再可用的產品。他們可以設定產品詳細信息，例如名稱、類別、價格、圖像和其他產品特定屬性。
• 高效率的訂單管理對於任何電子商務網站都至關重要。儀表板提供了用於檢視、處理和管理傳入訂單的綜合工具。
• 無縫整合Stripe作為支付網關，讓客戶進行安全、便利的線上付款。管理員可以查看交易記錄並確保為購物者提供無縫的結帳體驗。

測試項目

要測試該項目，請下載 zip 檔案並在您選擇的編輯器中開啟它。然後，在終端機中執行npm install以安裝依賴項。

npm install

安裝所需的依賴項後，您必須在專案資料夾的根目錄下建立一個.env檔。所需的環境變數如下。

 NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/
DATABASE_URL=
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=
STRIPE_API_KEY=
FRONTEND_STORE_URL=
STRIPE_WEBHOOK_SECRET=

請依照 Clerk、Planet Scale、Cloudinary 和 Stripe 的官方文件中的步驟取得環境變數的值。完成上述步驟後，執行npm run dev來測試專案。

npm run dev

如果您不想經歷所有麻煩，您可以隨時測試該專案的演示網站。