🛒 HODU OPEN MARKET

호두 오픈마켓은 판매자와 구매자가 각각 물건을 사고팔 수 있는 서비스입니다.

• DEMO

• 계정

  • 구매자
    • ID: marketbuyer
    • PW: buyer00!
  • 판매자
    • ID: marketseller
    • PW: seller00!

⚙️ 사용 기술

[ Front-end ]

• React
• Redux
• JavaScript
• HTML
• styled-component

[ Back-end ]

• 제공된 API 사용

[ Design ]

• Figma

[ Version ]

  "react": "^18.2.0",
  "axios": "^1.1.3",
  "react-redux": "^8.0.4",
  "react-router-dom": "^6.9.0",
  "react-hook-form": "^7.39.3",
  "react-cookie": "^4.1.1",
  "react-daum-postcode": "^3.1.1",
  "react-loading-skeleton": "^3.1.1",
  "react-slick": "^0.29.0",
  "react-spinners": "^0.13.8",
  "styled-components": "^5.3.5",

🖥️ 기능

페이지별 기능 설명

구매자 로그인	구매자 회원가입
판매자 로그인	판매자 회원가입
로그아웃	검색
비로그인 시	구매자 로그인 시
판매자 로그인 시	장바구니 수량 수정
장바구니 수량 누적	장바구니 아이템 삭제
전체 주문	개별 주문
구매하기	판매 상품 업로드
판매 상품 수정	판매 상품 삭제

📝 트러블 슈팅

트러블 슈팅에 관한 기록은 제 개인 벨로그에서 확인하실 수 있습니다.

📁 파일 구조

📦 hodu-open-market
├─ public
└─ src
   ├─ App.jsx
   ├─ Axios.jsx
   ├─ Cookie.js
   ├─ index.js
   ├─ api
   ├─ assets
   ├─ auth
   ├─ components
   │  ├─ CartBox
   │  ├─ DetailBox
   │  ├─ Dropdown
   │  ├─ Footer
   │  ├─ Header
   │  ├─ JoinForm
   │  ├─ Loading
   │  ├─ Login
   │  ├─ Modal
   │  ├─ PaymentBox
   │  ├─ ProductList
   │  ├─ QuantityButton
   │  ├─ SellerItem
   │  └─ Slide
   ├─ pages
   │  ├─ Cart
   │  ├─ Home
   │  ├─ Join
   │  ├─ NotFound
   │  ├─ Payment
   │  ├─ ProductDetail
   │  ├─ ProductUpload
   │  ├─ Search
   │  ├─ SellerCenter
   │  └─ SignIn
   ├─ redux
   │  ├─ action
   │  ├─ constants
   │  └─ reducer
   └─ styles
      ├─ app.css
      └─ reset.css