[#20] Add Home Page - Githubissues

작업 내역

메인 페이지 기본 html 및 css 설정 ac56342f9168e87e7aafe6cf8f0200870f585d59
Banner 컴포넌트 구현 be17f79eb5fac945990e7144b9850f6aba526812
BoxBanner 컴포넌트 구현 c5d99e5cab01ae7a975009c3d6e8c5274e0098f0
BoxSlider 컴포넌트 구현(swiper 라이브러리 사용) c9aaffec86fc752e61bb6cd036623f03707eff34
메인페이지 우측 영역 Masonry Layout 구현 및 메인 페이지 컴포넌트 분리 (react-responsive-masonry 라이브러리 사용) 69d8ab7c39a1290ad1c0632bf1f489f1708db6a0
- 현재 29cm의 tablet 영역 UI가 UX 상으로 좋지 않다고 판단해 개선하여 작업함
29cm UI 개선한 UI (eqCM)
모바일 메인 배너 슬라이드 컴포넌트 구현 5fd781b
이미지 border-radius 처리 1055da0
모바일시 한줄 슬라이드로 변경되도록 boxSlider 수정 13d3d9baf2cdb9aee531d478c6699df668d71100
더미 데이터 msw + react-query 활용
- mock data 관리를 위해 msw 라이브러리 사용 848ee55 (next.js 14 버전 HMR 문제로 node.js 적용 불가하여 brower.js만 적용함 참고 블로그)
- react-query 및 skeleton ui적용 (next/dynamic 활용) dfbc6ce1be128514c91376164b9b82509381f0e8

swiper를 사용할 때 29cm와 동일한 높이값 설정의 어려움 이슈 임시로 margin 값을 조정해 맞춰놓았으나 화면이 줄어들 때, 정렬되지 않은 형태가 됩니다...!
pinterest와 같은 UI를 구성하기 위해 ma 라이브러리를 활용했는데, 이 외의 방법이 있었을지 궁금합니다.