dropship admin

풀 스택 전자 상거래 + 대시보드 및 CMS: Next.js 13 앱 라우터, React, Tailwind, Prisma, MySQL, 2023

데모의 경우 스트라이프 테스트 카드를 사용하세요.

이것은 풀 스택 전자 상거래 + 대시보드 및 CMS를 위한 저장소입니다: Next.js 13 App Router, React, Tailwind, Prisma, MySQL

주요 특징:

• 우리는 관리자용으로 Shadcn UI를 사용할 것입니다!
• 우리의 관리 대시보드는 CMS, 관리 및 API 역할을 모두 수행할 예정입니다!
• 이 하나의 CMS를 통해 여러 판매자/매장을 관리할 수 있습니다! (예를 들어 "신발 매장", "노트북 매장", "양복 매장"이 있을 수 있으며 CMS는 이러한 모든 항목에 대한 API 경로를 개별적으로 생성합니다!)
• 카테고리를 생성, 업데이트, 삭제할 수 있습니다!
• 제품을 생성, 업데이트, 삭제할 수 있습니다!
• 제품에 대한 여러 이미지를 업로드하고 원할 때마다 변경할 수 있습니다!
• "색상", "사이즈" 등의 필터를 생성, 업데이트, 삭제한 후 "제품" 생성 양식에서 일치시킬 수 있습니다.
• 페이지 상단에 큰 텍스트인 "빌보드"를 생성, 업데이트 및 삭제할 수 있습니다. 단일 카테고리에 첨부하거나 독립형으로 사용할 수 있습니다. (우리 관리자는 모든 경우에 대해 API를 생성합니다!)
• 페이지 매김이 포함된 모든 카테고리, 제품, 크기, 색상, 광고판을 검색할 수 있습니다!
• 어떤 제품이 "추천"되어 홈페이지에 표시되는지 제어할 수 있습니다!
• 주문, 매출 등을 확인할 수 있습니다.
• 수익 등의 그래프를 볼 수 있습니다.
• 사무원 인증을 배우게 됩니다!
• 주문 생성
• 스트라이프 체크아웃
• 스트라이프 웹훅
• MySQL + Prisma + PlanetScale

전제 조건

노드 버전 14.x

저장소 복제

git clone https://github.com/vishwavinoth/dropship-admin.git

패키지 설치

npm i

.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 = /

# This was inserted by `prisma init` :
# Environment variables declared in this file are automatically made available to Prisma .
# See the documentation for more detail : https : / / pris . ly / d / prisma - schema #accessing - environment - variables - from - the - schema

# Prisma supports the native connection string format for PostgreSQL , MySQL , SQLite , SQL Server , MongoDB and CockroachDB .
# See the documentation for all the connection string options : https : / / pris . ly / d / connection - strings

DATABASE_URL = ''
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME = ""
STRIPE_API_KEY =
FRONTEND_STORE_URL = http : //localhost:3001
STRIPE_WEBHOOK_SECRET =

PlanetScale 및 Push Prisma에 연결

npx prisma generate
npx prisma db push

앱 시작

npm run dev

사용 가능한 명령

npm을 사용하여 명령 실행 npm run [command]

명령	설명
dev	앱의 개발 인스턴스를 시작합니다.