페이지네이션

 

 

 

🍬 페이지네이션(pagination)

한 번에 모든 데이터를 보여주지 않고,

여러 페이지로 나누어서 보여주는 기술

 

ex) 유튜브, 쇼핑몰, 게시판처럼 목록이 아주 많을 때

1페이지, 2페이지, 다음, 이전 버튼이 있는 것 

이 기능이 페이지네이션입니다

 

 

 

 

 

🍬 왜 필요한가?

1. 성능 향상

한 번에 1만 개 글을 가져오면 서버도 터지고 페이지도 느려진다

그래서 10개, 20개씩만 잘라서 가져옵니다

 

2. 화면 구성 깔끔

스크롤 무한대로 길어지면 보기 안좋은 문제 해결해준다

 

3. 데이터 관리 쉬움

요청할 때 "몇 번째 페이지?"라고 보내면

서버는 그 페이지에 맞는 데이터만 SELECT 해주면 됨

 

 

 

 

 

 

🍬 페이지네이션 구조 예시

예를 들어 게시판 글이 153개 있고,

한 페이지에 10개씩 보여준다고 할 때

 

총 게시글: 153개
페이지당: 10개
총 페이지 수: 16페이지

 

UI는 이렇게 생김

<< < 1 2 3 4 5 > >>

 

 

 

 

 

🍬 기술적으로 어떻게 동작하는지

ex) 프론트에서 /board?page=3 요청 →
서버는 page=3 기준으로 DB에서 필요한 데이터만 SELECT

 

SELECT * FROM board  ORDER BY id DESC LIMIT 10 OFFSET 20;

 

 

 

 

 

 

데이터가 많을 때 적당한 양만 잘라서 보여주는 기능

게시판 페이지 번호가 바로 이것