# pagination

117개의 포스트
post-thumbnail

[DRF]Pagination 구현

"이전/다음" 링크를 사용하여 여러 페이지로 분할된 데이터를 관리

2022년 9월 27일
·
0개의 댓글
·

목록 조회 시 페이지네이션(Pagination)

강의 목록 조회 강의의 목록을 조회할 때 페이지별로 보여줘야한다. /lectures?page= 위와 같이 쿼리 스트링으로 page를 받아 각 페이지에 맞는 강의 목록을 조회하도록 해야겠다. 만약 파라미터를 안주고 /lectures를 호출하면 1페이지를 반환해주어야

2022년 9월 24일
·
0개의 댓글
·
post-thumbnail

[React] 쿼리 스트링

쿼리스트링은 URL의 한 부분이며 요청하고자 하는 URL에 부가적인 정보를 포함하고 싶을 때 사용한다.기존 URL 요청 예시)프론트: /list -> 리스트 요청     /detail/ ->상세 페이지 요청백엔드: /signin -> 로그인에 대한 응답    /prod

2022년 9월 24일
·
0개의 댓글
·

restaurants.tsx

들어가기Client로 접속했을때,모든 식당들이 나열되어 보이는 page

2022년 9월 22일
·
0개의 댓글
·
post-thumbnail

JPA Pagination

레포지토리에 예시로 Pageable 타입의 파라미터를 받는 findAll 함수를 오버로딩(Overloading)했다.리턴 타입은 Page<MemberBak>이다.API에서 Pageable 타입의 파라미터를 받아서 findAll 인자로 넘겨준다.리턴 타입은 동일하게

2022년 9월 21일
·
0개의 댓글
·
post-thumbnail

[DRF] DRF 공식문서로 Pagination을 구현하자

DRF 공식문서를 참조하여 Pagination API를 구현해보자. 거기에 Generic View와 Viewset을 곁들인...

2022년 9월 8일
·
0개의 댓글
·
post-thumbnail

📃Django DRF ViewSet을 활용한 Pagination

DRF의 페이지네이션 공식문서를 참조하여, 쉽고 빠르게 API를 구현한다공식문서의 Viewset을 학습하여, 기존의 View, generic View와의 차이점을 알아보자DRF 공식문서를 참조하여 View를 구현한다공식문서를 참조하여 Request와 Response를

2022년 9월 8일
·
0개의 댓글
·
post-thumbnail

[React Query] Section5 - Query Features 1: Pre-Fetching and Pagination

Prefetch and Pagination (캐시에 데이터 추가하기)

2022년 8월 29일
·
0개의 댓글
·
post-thumbnail

Pagination vs Infinite Scroll

페이지네이션은 페이지 번호를 이용해 페이지fmf 이동하는 방식이다. map을 활용하면 코드가 더 짧아진다. 이전페이지와 다음 페이지는 아래와 같이 구현한다.npm사이트에 있는 인기 라이브러리! 그러니까 독스 보면서 더 익숙해지자.

2022년 8월 25일
·
0개의 댓글
·

[Project1] TIL#8

1) > 세 가지 뷰는 거의 동일한 기능을 가진다. 그런데 TemplateView에서는 templatename을 명시적으로 지정해준 반면에 DetailView에서는 모델명과 모델이 위치한 앱 그리고 이것이 DetailView인 점에서 'itemdetail'을 유추하는 기능이 내재돼있다. >> DetailView가 SingleObjectTemplateRes...

2022년 8월 22일
·
0개의 댓글
·
post-thumbnail

[JPA] N+1 문제 해결하기

1 + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N + N

2022년 8월 18일
·
0개의 댓글
·

Pagination(product page)

product page에서 pagination을 구현해 본다.home page인 product page만 구현해 보고,나머지 page에서는 시간 될때, 구현해 본다.다음page 혹은 이전 page로 이동하는것을 나타내는 버튼을 component로만들어 놓음다른 부분은

2022년 8월 14일
·
0개의 댓글
·

[React--Monster예제 3] Limit과 offset을 활용해 pagination 구현하기

그동안 해보고 싶었던 기능중 하나는 바로 pagination기능이다. 보통 구현을 하기전에 "어떻게"를 먼저 생각해보곤 하는데, 실제로 구현에 들어가기 전에 고민했던 시간이 비교적 많았다.1\. fetch()로 데이터를 다 받아오고 useState에 저장.1\. 1,2

2022년 8월 14일
·
0개의 댓글
·
post-thumbnail

Pagination

페이지네이션(Pagination)이란 웹사이트에서 일정 수준 페이지 개수가 쌓이게 되면 그 다음 페이지로 넘어갈 수 있게 하는 기능을 의미한다.위와 같이 웹 사이트에서 데이터 또는 콘텐츠들을 여러 페이지로 분리해 보여줄 수 있게 해주는 것이다.대부분 백엔드에서는 한 페

2022년 8월 10일
·
0개의 댓글
·

[Spring Boot] QueryDSL 커서 기반 페이지네이션 구현해보기

페이지네이션의 구현 방법에는 크게 두 가지가 있는데 바로 offset과 cursor 방식입니다.먼저 offset 기반과 cursor 기반 페이지네이션의 차이점을 알아보겠습니다.아래와 같은 게시물이 5개이고, 한 페이지 당 2개의 게시글을 나타낸다 가정해보겠습니다.boa

2022년 8월 8일
·
0개의 댓글
·

[iOS] CollectionView, TableView Pagination

🤔 CollectionView와 TableView에서 Pagination(스크롤을 이용한 페이징)하는 방법은 어떤 것이 있을까? 일반적으로 ContentOffSet와 ContentSize을 계산하는 것을 통해 Pagination 기능을 구현한다.그래서 ContentO

2022년 8월 1일
·
0개의 댓글
·
post-thumbnail

[TIL] 22.07.27 WED

Api로 호출한 데이터의 양이 많을 때, 이를 여러 페이지에 나눠서 표시하는 방법에 대해 알아보았다.데이터 호출먼저 Api를 통해 데이터를 호출한다. data는 useQuery() 훅 함수를 이용하여 호출했다.페이지 구성먼저 useState() 훅 함수를 활용해 페이지

2022년 7월 29일
·
0개의 댓글
·
post-thumbnail

[React] 페이지네이션(pagination) 페이징 처리

기업 협업 중 페이지네이션을 해야하는 상황이 생겼다. 라이브러리를 사용하면 쉽다고 했으나 페이지네이션에 대한 이해를 하고 싶어 라이브러리 없이 사용하는 방법에 대해 많은 검색을 했다. 페이지 네이션은 앞으로도 어디서든 많이 사용할 것이라는 생각이 들어 정리를 하려 한다

2022년 7월 28일
·
0개의 댓글
·
post-thumbnail

Spring Pagination으로 무한스크롤 구현

페이지네이션 하는법 1. 파라미터를 Pageable 객체로 받거나 page와 size받기. Pageable 객체로 받을 때 주의할 점은 @RequestParam 없이 받는다. 2. 참고자료 Pageable을 이용한 Pagination을 처리하는 다양한 방법

2022년 7월 25일
·
0개의 댓글
·
post-thumbnail

[React] 페이지네이션 구현

라이브러리 사용하지 않고 페이지네이션 구현하기

2022년 7월 21일
·
0개의 댓글
·