목록으로 돌아가기
디자인플러그샵 관리자 시스템
인쇄 디자인 플랫폼의 B2B 관리자 시스템
공급사-판매사 간 상품 등록, 주문 처리, 월별 정산 업무를 효율적으로 운영할 수 있습니다.
1 / 6
담당 역할
기획디자인프론트엔드백엔드
기술 스택
Next.js
TypeScript
Prisma
MySQL
Mantine UI
TanStack Query
React Hook Form
Zod
TipTap Editor
react-dnd-treeview
xlsx-js-style
NextAuth.js
주요 기능
- 분류 관리: 드래그앤드롭 방식의 계층적 카테고리 트리 구조 관리
- 상품군 관리: 카테고리별 상품 그룹 생성, 이미지 업로드 및 진열순서 관리
- 공급사/판매사 관리: 협력사 정보 조회 및 상품 연결 관리
- 정산 관리: 공급사별 월별 정산 내역 조회, 상태 일괄 변경, 엑셀 다운로드
- 게시판 관리: 공지사항, FAQ, 가이드 등 컨텐츠 관리 및 TipTap 기반 에디터 제공
수행 업무
- Server Actions 패턴 추상화: createServerAction 유틸리티로 인증 체크, 에러 처리, 타입 안전성을 통합한 서버 액션 래퍼 구현
- 계층적 트리 구조 관리: react-dnd-treeview를 활용한 드래그앤드롭 기반 분류 순서 및 부모-자식 관계 변경, 트랜잭션 기반 일괄 저장
- 커스텀 에러 클래스 체계: AppError 기반 상속 구조로 BadRequest, NotFound, Authorization 등 HTTP 상태 코드별 에러 처리 및 자동 로깅
- 동적 필터링 시스템: Zod 스키마 기반 URL searchParams 파싱으로 타입 안전한 서버 컴포넌트 필터링 구현
- 정산 날짜 범위 쿼리: 연도-월 복합 조건 쿼리 로직으로 다년도 범위 정산 데이터 효율적 조회
- Raw SQL 기반 벌크 업데이트: Prisma의 $executeRaw와 CASE WHEN 구문으로 다수 레코드 순서 변경 단일 쿼리 처리
- 엑셀 다운로드 기능: xlsx-js-style을 활용한 스타일링된 정산 데이터 엑셀 내보내기
#B2B 플랫폼
#관리자 시스템
#정산 관리
#상품 관리
#Next.js
#Prisma