KDT5 7조 프로젝트-WinkBook #7
Conversation
test: test
[230612]1차PR-서동욱
- 메인에서 넘어온 상세 정보 - 상세 페이지 스타일 수정
[230612]1차PR-김하은
[230615] 2차PR-서동욱
- 장바구니 버튼 클릭시 localstorage 저장 - 추가 스타일 수정
- localstorge에 있는 item 데이터 가져오기.
- 체크 표시 클릭시 , total 가격 표시
[230615]2차PR-김하은
- api수정 - 환경변수 수정 - 스타일 수정 - 회원수정 기능 추가
searchpage 수정, alert 수정
로그인/가입, 마이페이지 반응형 추가
- 스타일 수정
- api 변경 사항 수정 - 마이페이지 스타일 수정 - 마이페이지 기능 추가
fix: 오류사항 수정
fix: title 수정
|
|
||
| const { VITE_IMP_KEY, VITE_IMP_SECERET } = import.meta.env; | ||
|
|
||
| export const ajax = axios({ |
There was a problem hiding this comment.
nit: 'ajax' 단어 대신 용도가 더욱 명확히 드러나는 네이밍 처리가 좋아 보여요
| const { VITE_CAFE24_URL } = import.meta.env; | ||
| const key = new RegExp(`accessToken=([^;]*)`); | ||
|
|
||
| const ajax = axios.create({ |
There was a problem hiding this comment.
nit: ajax 관련 유틸을 따로 하나만들어 보면 import.meta.env나 axios.create() 와 같은 중복된 코드를 줄일 수 있을 것 같아요
| profileImgBase64: string | ||
| ) => { | ||
| const URL = '/signup'; | ||
| const res = await axiosInstance.post(URL, { |
| } | ||
| } | ||
|
|
||
| export const MypageToken = async () => { |
| } | ||
|
|
||
| .formBox { | ||
| width: 400px; |
There was a problem hiding this comment.
nit: 현재 헤더만 width를 auto로 주었는데 로그인폼은 정적너비로 설정되어 있군요 width를 고정 너비값이 아닌 100%로 설정해서 싱크를 맞춰주느게 좋아보여요
| } | ||
| } | ||
|
|
||
| .left { |
There was a problem hiding this comment.
nit: 클래스명을 형용사가 아닌 명사로 표현하면 좀더 구체적으로 무슨 태그에 입혀지는 디자인인지 유추가 가능하고 좋아요
| carousel.current?.classList.add("transition"); | ||
| idx++; | ||
| setTransform(50 * idx); | ||
| if (idx === arr.length - 2) { |
There was a problem hiding this comment.
nit: 중첩 if문 idx만 조건에 따라 리턴해주는 유틸을 만들면 중첩 if문보다 훨씬 코드가 깔끔해지지 않을까요?
| img { | ||
| position: absolute; | ||
| width: 100%; | ||
| height: 100%; |
There was a problem hiding this comment.
nit: height는 auto로 주는게 좋아요 너비 높이를 둘다 잡으면 이미지가 깨집니다
| } | ||
| .carousel { | ||
| display: flex; | ||
| width: 100%; |
There was a problem hiding this comment.
nit:max-width를 설정해주면 해상도가 너무 커질때 캐러셀 레이아웃이 깨지는걸 방지할 수 있어요
| box-shadow: 5px 5px 5px #b98563; | ||
|
|
||
| .RoundCircle { | ||
| width: 0.8rem; |
There was a problem hiding this comment.
nit: 어떤 요소는 width, height를 px로 설정하고 이건 rem으로 설정하셨는데 이유가 있을까요?
WinkBook
WinkBook은 e-book을 판매하는 컨셉의 쇼핑몰 사이트 입니다.
총 5개의 도서별 카테고리가 나눠져 있으며 실제 도서 사이트에서 사용하는 상세 설명을 나타내도록 했습니다.
쇼핑몰을 만들 때 충분히 활용할 수 있는 사이트를 개설하자는 목표를 가지고 진행 되었으며, 실제 오픈 Api를 활용하여 기능을 구현하였습니다.
커머스:
결제:
(테스트 결제 모듈이기 때문에 연결된 카드사만 결제가 됩니다. 주후 추가적인 결제 모듈도 도입해볼 생각입니다.)
배포 사이트
WinkBook
WinkBook-Admin
프로젝트 기간
2023.05.30 ~ 2023.07.02
기술스택
Develoment
Config
Enviroment
Deployment
프로젝트 주요 기능
메인
상세페이지
검색
마이페이지
어드민페이지
팀원