깃헙주소: https://github.com/wecode-bootcamp-korea/justcode-7-2nd-millieIslibrary-front
베포주소:http://15.164.216.64:3000/
하이라이트 => 내가 구현한 기능!!
페이지별로 나눠서 기능구현=>welcome,로그인,메인,검색,내서재,상세
스크롤 에니메이션 구현
자동케러셀 구현
nav, footer 구현
자동캐러셀 및 드레그슬라이드구현
다크모드기능 구현
top버튼 기능구현
장르 카테고리 구현
1.welcome페이지
new IntersectionObserver
를 이용해서 화면의 스크롤을 감시하여 스크롤이벤트를 넣었고
slick 라이브러리를 사용해서 무한 케러셀을 구현했다
2.자동캐러셀 및 드레그슬라이드 구현
드레그 슬라이드를 구현하기 위해서는 마우스의 움직임을 제어하기 위해 마우스 이벤트에 대한 공부와 스크롤 이벤트로 인한 성능 저하를 막기 위한 스로틀
과 디바운스
에 대한 이해가 필요했다
기능자체는 단순해 보였지만 처음 접하는 이벤트와 변수가 많아서 가장 구현이 어려웠다
이후 slick 케러셀 라이브러리를 사용했을때 라이브러리의 편리성도 더 와닿았다
3.top버튼 및 다크모드기능구현
프로젝트 중에 가장 즐거웠던 기능을 꼽으라면 사용자의 편의를 생각하면서 만든 top버튼과 다크모드기능이다
1차 프로젝트에서 끝도없이 타고내려가는 props
를 보고 useContext
를 사용해 전역으로 다크모드기능을 사용할 수 있도록 하였다
4.장르별 카테고리구현
쿼리파라미터를 사용해서 각 장르에 맞게 데이터가 6개씩 나타날 수 있도록 제한을 걸었다
“아는 만큼 보이고 한 만큼 성장한다” 개발의 가장 매력적인 부분이라고 생각한다. 1차와 비교했을때 3일을 끙끙 거렸던 fetch를 한번에 성공했을 때 백엔드와 더 잘 소통했고 짧은 2주 만에 더 성장했다고 느껴서 행복했다
새로운 기능이나 에러를 보면 두렵더라도 당장의 막막함 보다는 이후의 성장이라는 긍정을 심어준 프로젝트였다
많은 기능을 구현하고 싶다는 욕심이 앞서서 기능의 깊이와 디테일 보다는 구현 자체에 욕심을 더 낸거 같다
완성에 급급해서 더 좋은코드, 더 간결한코드를 생각하는 시간이 가장 중요하다는 것을 알면서도 그 시간에 크게 투자하지 않았던거 같다. 배우고 성장해나가는 기간인 만큼 조급함을 내려놓고 한 코드에 대해 생각할 시간을 더 많이 가질 수 있도록 노력하고 리팩토링도 열심히 할 것이다