1. 프로젝트 개요
| 항목 |
내용 |
| 프로젝트명 |
직구라운드 사용자단 및 관리자단 |
| 유형 |
B2B 크로스보더 이커머스 플랫폼 |
| 역할 |
FE 70% |
| 기간 |
2026.01.30 ~ 현재 |
| 팀 구성 |
기획&디자인: 2명,BE: 2명, FE: 2명 |
프로젝트 소개
한국 구매자와 중국 공급사를 연결하는 B2B 크로스보더 이커머스 플랫폼입니다. 1688 API 연동을 통한 중국 상품 소싱, 매칭라운드(일반 상품 거래), OEM 라운드(주문 제작) 비즈니스 모델을 제공합니다. 구매회원이 상품 요청서를 작성하면 공급회원이 제안서를 제출하고, 매칭/견적/주문/발주/배송까지 전체 거래 프로세스를 관리합니다.
2. 기술
스택
Frontend Core
| 기술 |
버전 |
선택 이유 |
| Next.js |
최신 버전 |
SSR/SSG 지원으로 SEO 최적화, 파일 기반 라우팅 - 사용자단 |
| React |
19 |
컴포넌트 기반 UI 개발, 대규모 생태계 - 관리자 단 |
| TypeScript |
5.x |
타입 안전성, 코드 품질 향상, 개발 생산성 |
상태 관리
| 기술 |
용도 |
| Zustand |
Client - 경량 전역 상태 관리 |
| TanStack Query |
서버 상태 관리, 데이터 페칭 및 캐싱 |
UI/스타일링
| 기술 |
용도 |
| Tailwind CSS |
유틸리티 우선 CSS 프레임워크, 빠른 스타일링 |
| shadcn/ui |
Radix UI 기반 재사용 가능한 컴포넌트 라이브러리 |
| Recharts |
대시보드 차트 및 데이터 시각화 |
빌드/개발 도구
| 기술 |
용도 |
| Vite |
Admin 관리자 사이트 빌드 도구 |
| Turbopack |
Client 사용자 사이트 번들러 |
| pnpm |
패키지 매니저, 워크스페이스 관리 |
| Storybook |
컴포넌트 문서화 및 개발 |
| ESLint + Prettier |
코드 린팅 및 포맷팅 |
기타 주요 라이브러리
| 기술 |
용도 |
| Axios |
HTTP 클라이언트 |
| WebSocket |
실시간 채팅 및 알림 통신 |
| React Hook Form + Zod |
폼 관리 및 유효성 검증 |
| date-fns |
날짜 처리 |