[FEAT] 페이지네이션 컴포넌트 구현

[bykbyk0401]

🛰️ 관련 이슈

해결한 이슈 번호를 작성해주세요
close #66

🧑‍💻 작업 내용

작업한 내용을 간략히 작성해주세요

• 페이지네이션 컴포넌트 구현
  • renderPageNumbers 함수로 페이지 번호 렌더링 로직 작성
  • 화살표 버튼 비활성화 처리
• 한번에 보이는 페이지는 5단위
• PageBtn 컴포넌트 렌더링 구현
• 스타일 동적으로 적용 (활성/비활성 상태)
• 뷰에 따른 색상 변경 가능

🗯️ PR 포인트

리뷰어가 특별히 봐주었으면 하는 부분이 있다면 작성해주세요

• renderPageNumbers 함수 로직의 조건 처리
  • 총 페이지 수와 현재 페이지 위치에 따라 동적으로 페이지를 렌더링하는 로직이 적절한지 확인 부탁드립니다.
  • 현재 페이지가 포함된 범위에서의 첫번째 페이지와 마지막 페이지에 따라 페이지를 렌더링하는 로직을 구현하였습니다.
• isLeftDisabled와 isRightDisabled 조건 처리와 버튼 비활성화 상태 구현

🚀 알게된 점

기록하며 개발하기!

• Array.from을 사용하여 반복되는 페이지 번호 렌더링 구현
• 버튼 비활성화

📖 참고 자료 (선택)

참고했던 문서들 공유하기!

📸 스크린샷 (선택)

[github-actions]

🪷 Storybook 확인 🪷
🔗 https://677fa9af1269762b7858c29f-ktmohfppgk.chromatic.com/