Next.js E-Commerce App & Admin Panel UI Design Tutorial | Shopping App Design
- Next.js를 사용하여 전자 상거래 앱 디자인 🎨.
- 홈페이지에는 추천 상품 표시, 카테고리, 색상, 사이즈 변경 가능 🔄.
- 장바구니 아이콘 업데이트를 위해 상태 관리 도구 사용 🛒.
- URL에 필터 저장, 다음 튜토리얼에서 데이터 필터링 🔗.
- 싱글 제품 페이지에서 수량 증가 및 장바구니 추가 기능 ➕.
- 장바구니 페이지에서 제품 목록, 총 가격 확인 및 제거 가능 🗑️.
- 배송 정보 및 카드 정보 입력 후 주문 완료 단계 제공 🚚.
- 채팅 튜토리얼에서 디자인한 관리자 패널을 기반으로 전자 상거래 앱 관리자 패널 디자인 ⚙️.
- 사용자, 제품 페이지 추가 및 주문, 사용자, 카테고리, 제품에 대한 폼 컴포넌트 생성 📝.
- 각 색상별로 새로운 제품 이미지 업로드 기능 제공 🖼️.
- 디자인 완료 후 백엔드 생성 및 디자인 연결 예정 💻.
- 오픈 소스 프로젝트이며, GitHub 저장소에서 시작 템플릿 사용 가능 ⭐.
- 반응형 디자인을 위해 화면 크기에 따라 다른 간격 적용 📱.
- Lucid 아이콘 라이브러리를 사용하여 아이콘 추가 🔎.
- Navbar 및 Footer 컴포넌트 생성 및 레이아웃에 적용 🧱.