BookHub

원하는 책이 어느 도서관에 있는지 찾기 번거로움

서울시 내 강남구·강동구·마포구·영등포구 등 여러 구립 도서관의 소장 정보를 각각 따로 확인해야 하는 불편함에서 출발했습니다. 도서관을 한 곳씩 검색하지 않고, 한 화면에서 원하는 책의 소장 여부와 위치를 확인할 수 있는 플랫폼을 만들었습니다.

처음 구현해 본 페이지 나누기

코딩을 처음 배우며 만든 프로젝트라, 수십 권이 넘는 신착·인기 도서 목록을 한 화면에 모두 띄우지 않고 페이지 단위로 나눠 보여주는 기능을 구현하는 것이 가장 어려웠습니다. 몇 번째 책부터 몇 번째 책까지 보여줄지와 전체 페이지 수를 계산해, 화면의 번호 버튼과 맞춰야 했습니다.

서버에서 전체 목록을 가져온 뒤, 요청한 페이지 번호에 맞춰 (페이지 − 1) × 페이지당 개수 위치부터 정해진 개수만 잘라 보내고, 전체 개수를 페이지당 개수로 나눠 전체 페이지 수를 계산해 번호 버튼을 만들었습니다. 도서 검색은 4개 구립 도서관의 검색 페이지를 Puppeteer로 동시에 조회해 결과를 한 화면에 모았습니다.

팀원들과 함께 서울시 주요 구립 도서관의 도서를 한 번에 검색하고, 신착·인기 도서와 AI 추천·요약까지 볼 수 있는 웹 플랫폼으로 완성했습니다. 로그인, 도서 검색, 상세정보, 마이페이지까지 하나의 흐름으로 연결했습니다.

팀 발표자료 표지 — 팀명 P1J4