/wanted_pre_onboarding_02

상품등록 과제 구현 내용을 담은 레포지토리입니다

Primary LanguageJavaScript

Pre Onboarding 2nd 과제 - 상품 등록

서비스 링크 : https://fervent-tereshkova-9b041a.netlify.app/

img

팀원

박중섭 우종원 이태림 임수영

팀원 별 기능 구현 사항

태림: 상품 기본 정보 구현 및 state 관리

종원: 노출 및 판매 기간 설정, 재사용 가능 컴포넌트 생성, 상품소개 이미지, 구매자 추천 이미지 구현

수영: 상품 옵션 등록, 추가 옵션 상품 등록, 옵션 등록 영역, 옵션세트 이미지 첨부 기능 구현 및 CSS 적용

중섭: 상품 배송 설정 및 상품 정보 고시 구현

초기 세팅

  1. 설치
npm install
npm install react-redux @reduxjs/toolkit
npm install --save react-router-dom
  1. 절대 경로 설정 - 참고문헌

파일 구조 설정

 ├── public
 └── src
     ├── components
     │   ├── BuyerRecommendImg
     │   ├── Etc
     │   ├── NoticeProductInfo
     │   ├── ProductBenefit
     │   ├── ProductDelivery
     │   ├── ProductInfo
     │   ├── ProductOptions
     │   ├── ProductPeriodSetup
     │   ├── ProductThumbnail
     │   └── UploadImages
     ├── layout
     │   ├── Inputs
     │   └── Section
     ├── pages
     ├── store
     │   └── Contexts
     └── utils
         └── svg

과제 중점 사항

  1. 재사용 가능성 향상

    1. 재사용 가능한 하나의 버튼 컴포넌트를 생성
    2. 반복되는 값, 함수, 스타일 등을 따로 지정하여 생산성을 높였다.
    3. 간단한 tag 설정으로 컴포넌트를 재사용하였다.