[리팩토링: 1차프로젝트] 상품디테일 페이지
2022. 7. 14. 20:59
회고 & 일상
완성도있는 프로젝트를 위해 기록한 리팩토링 로그 리팩토링을하면서 가장 오래걸렸던 페이지 중 하나였다. 우선 상품리스트 페이지의 수정(오류)사항을 살펴보면 1. Mock data 하나로 합쳐서 수정 2. 전체적인 UI 디테일 수정 2. Radio 버튼을 클릭했을때, 각 컬러값이 보이도록 수정 3. 화폐단위 디테일 문제 5. 버튼을 모두 선택했을때만 장바구니로 넘어가도록 'Alert 기능' 추가 6. Cart modal 창 추가 7. WomensDetail page 새로 만들기 📌프로젝트 시연 영상 Mock data 하나로 합쳐서 수정 우선 detailColorList와 detatilSmallList로 나눠져있었던 목데이터를 하나로 합쳐주었고, newDetail.json 파일을 만들어서 데이터파일 하나에서 ..
[리팩토링: 1차프로젝트] Aside 페이지
2022. 7. 13. 02:15
회고 & 일상
완성도있는 프로젝트를 위해 기록한 리팩토링 로그 Aside 페이지에서 추가, 또는 수정사항들 1. 카테고리 리스트 항목을 상수데이터로 변경 2. 리스트 항목 클릭시 '엑티브 효과' 추가 3. listLanging 페이지 추가 전체적으로 1차 프로젝트의 경우엔 백엔드의 의존도가 높은편이라, 페이지별로 목데이터와 상수데이터로 변경해주었다. 카테고리 리스트 항목을 상수데이터로 변경 기존에 만들어놓았던 상수데이터를 활용하였다. ✏️상수 데이터 ✏️작성코드 카테고리 리스트와 그안에 카테고리 타입도 map을 사용해서 뿌려주었다. 항목 클릭시 '엑티브 효과' 추가 ✏️작성코드 const [countIndex, setCountIndex] = useState(0); const handleOnClick = (id) => ..
[리팩토링: 1차 프로젝트] 상품리스트 페이지
2022. 7. 12. 23:14
회고 & 일상
완성도있는 프로젝트를 위해 기록한 리팩토링 로그를 시작한다. 프로젝트 당시 시간부족으로 완성도 있는 페이지를 만들지 못하여 추후에 리팩토링을 생각하고 있었다. 우선 상품리스트 페이지의 오류사항을 살펴보면 1. fiter로 걸러질때, 해당 tag만 보이지않고, tag 4개가 다보여지는 에러. 2. 걸러지는 데이터 갯수에 따라 '총 00개의 상품이 있습니다.' 라고 보여줘야하지만 상단의 데이터 값이 바뀌지않는 에러. 3. tag 클릭시 '엑티브 효과' 에러. 4. 10,000 화폐단위 디테일 문제 5. 상품 tag부분 UI 간격이 안맞는 문제 6. womesList page 새로 만들기 📌1차 프로젝트 시연영상 fiter로 걸러질때, tag 4개가 다보여지는 에러. 우선 백앤드와의 API 통신을하지 않으니,..