[React] 간단한 카카오 굿즈샵 리마스터 리뷰

서론

요즘 기존에 만들어두었던 프로젝트들을 다시 손보고 있다.

이번엔 카카오 굿즈샵을 리마스터했고, 프로젝트를 하면서 느낀 점에 대해 써본다.

---

사용한 라이브러리 

• recoil (상태관리)
• styled-components (스타일링)
• react-router-dom (라우팅)
• framer-motion (애니메이션)
• gh-pages (배포)

---

개선점

• 일본어에 맞춰 폰트 스타일 변경.
• css root selector(가상 선택자) 폐기 및 모든 사이즈 rem 단위 사용.
• 헤더바 디자인 개선.
• 아이템 카드 디자인 개선.
• 디테일 페이지 상품 이미지 -> 이미지 슬라이더로 변경.
• 카트 페이지 스타일 변경.

---

완성본

012

완성본

---

후기

이번에는 추가기능 없이 디자인만 변경했다.

styled-components 라이브러리와 css 가상 선택자를 함께 사용하려니

미디어 쿼리를 설정하는 부분에 있어서 조금 불편함이 있었기 때문에 과감하게 폐기를 했다.

 

아쉬운 점으로는 디자인이 내 생각대로 괜찮게 나오지 않은 것과 추가 기능을 넣지 못한 점,

상품 상세 화면 내용이 너무나도 빈약한 것 정도이다.

 

추후에 꼭 세 개 모두 개선해서 더 괜찮은 앱으로 만들어 볼 것이다.

 

 

 

https://mediumryan.github.io/kakao-shop-demo

KaKao Shop by Ryan

https://github.com/mediumryan/kakao-shop-demo

GitHub - mediumryan/kakao-shop-demo: kaka-shop-app by react js