1
http://localhost:3000/posts?order__createdAt=ASC&where__id_more_than=3&take=20
2

3
// 오름차순으로, id가 3보다 큰 데이터를, 20개의 포스트를 가져온다.

1
{
2
  // 데이터를 리스트로 받는 부분
3
  "data": [
4
    {
5
      "id": 4,
6
      "updatedAt": "2023-06-06T15:41:33.928Z",
7
      "createdAt": "2023-06-06T15:41:33.928Z",
8
      "title": "test",
9
      "content": "test123",
10
      "likeCount": 0,
11
      "commentCount": 0,
12
      "author": {
13
        "id": 1,
14
        "nickname": "codefactory5",
15
        "email": "test5@codefactory.ai",
16
        "role": "USER"
17
      }
18
    }
19
  ],
20
  // paging 관련 정보를 입력하는 곳
21
  "paging": {
22
    // 다음 커서에대한 정보
23
    "cursor": {},
24
    "after": 4,
25
    // 총 몇개의 데이터가 응답왔는지
26
    "count": 20,
27
    // 다음 요청 URL
28
    "next": "http://localhost:3000/post?order__createdAt=ASC&take=20&where__id__more_than=4"
29
  }
30
}

1
import { IsIn, IsNumber, IsOptional } from 'class-validator'
2

3
export class PaginatePostDto {
4
  /*** 이전 마지막 데이터의 ID
5
   * 이 프로퍼티에 입력된 ID보다 높은 ID부터 값을 가져오기
6
   */
7
  @IsNumber()
8
  @IsOptional()
9
  where__id_more_than?: number
10

11
  /*** 정렬
12
   * createdAt : 생성된 시간의 내림차/오름차 순으로 정렬
13
   */
14
  @IsIn(['ASC']) // 리스트에 있는 값들만 허용
15
  @IsOptional()
16
  // eslint-disable-next-line @typescript-eslint/prefer-as-const
17
  order__createAt: 'ASC' = 'ASC'
18

19
  /*** 갖고올 데이터 개수
20
   * 몇 개의 데이터를 응답으로 받을지
21
   */
22
  @IsNumber()
23
  @IsOptional()
24
  take: number = 20
25
}

1
// posts.controller.ts 생략
2
@Get()
3
getPosts(
4
  @Query() query: PaginatePostDto, //
5
) {
6
  return this.postsService.getAllPosts()
7
}

1
// posts.service.ts 생략
2
/***
3
 * 1) 오름차순으로 정렬하는 pagination만 구현한다
4
 */
5
async paginatePosts(dto: PaginatePostDto) {
6
  const posts = await this.postsRepository.find({
7
    where: {
8
      // 더 크다 / 더 많다
9
      id: MoreThan(dto.where__id_more_than ?? 0),
10
    },
11
    order: {
12
      createdAt: dto.order__createAt,
13
    },
14
    take: dto.take,
15
  })
16

17
  /*** Response
18
   * data : Data[],
19
   * cursor : {
20
   *  after: 마지막 Data의 ID
21
   * }
22
   * count: 응답한 데이터의 개수
23
   * next: 다음 요청을 할 떄 사용할 URL
24
   */
25
  return {
26
    data: posts,
27
  }
28
}

1
// posts.controller.ts
2
/*** 1) GET /posts
3
 * 모든 post를 다 가져온다
4
 */
5
@Get()
6
getPosts(
7
  @Query() query: PaginatePostDto, //
8
) {
9
  return this.postsService.paginatePosts(query)
10
}

1
// 생략
2
async function bootstrap() {
3
  const app = await NestFactory.create(AppModule)
4
  app.useGlobalPipes(
5
    new ValidationPipe({
6
      transform: true,
7
    }),
8
  )
9
  await app.listen(3000)
10
}
11
bootstrap()

1
// posts.service.ts
2
/*** 페이지네이션용 테스트 포스트 생성
3
 *
4
 */
5
async generatePosts(userId: number) {
6
  for (let i = 0; i < 100; i++) {
7
    await this.createPost(userId, {
8
      title: `임의로 생성된 포스트 제목 ${i}`,
9
      content: `임의로 생성된 포스트 내용 ${i}`,
10
    })
11
  }
12
}

1
// posts.controller.ts 생략
2
/*** POST /posts/random
3
 *
4
 */
5
@Post('random')
6
@UseGuards(AccessTokenGuard)
7
async postPostsRandom(@User() user: UsersModel) {
8
  await this.postsService.generatePosts(user.id)
9
  return true
10
}

1
import { Type } from 'class-transformer'
2
import { IsIn, IsNumber, IsOptional } from 'class-validator'
3

4
export class PaginatePostDto {
5
  /*** 이전 마지막 데이터의 ID
6
   * 이 프로퍼티에 입력된 ID보다 높은 ID부터 값을 가져오기
7
   */
8
  @Type(() => Number) // URL에 string으로 들어온 값을 number로 변환해줌
9
  @IsNumber()
10
  @IsOptional()
11
  where__id_more_than?: number
12

13
  // 생략
14
}

1
// main.ts 생략
2
async function bootstrap() {
3
  const app = await NestFactory.create(AppModule)
4
  app.useGlobalPipes(
5
    new ValidationPipe({
6
      transform: true,
7
      transformOptions: {
8
        // 임의로 변환을 허가
9
        enableImplicitConversion: true,
10
      },
11
    }),
12
  )
13
  await app.listen(3000)
14
}
15
bootstrap()

1
export const PROTOCOL = 'http'
2
export const HOST = 'localhost:3000'

1
// posts.service.ts 생략
2
/***
3
 * 1) 오름차순으로 정렬하는 pagination만 구현한다
4
 */
5
async paginatePosts(dto: PaginatePostDto) {
6
  const posts = await this.postsRepository.find({
7
    where: {
8
      // 더 크다 / 더 많다
9
      id: MoreThan(dto.where__id_more_than ?? 0),
10
    },
11
    order: {
12
      createdAt: dto.order__createAt,
13
    },
14
    take: dto.take,
15
  })
16

17
  /****
18
   * 해당되는 포스트가 0개 이상이면, 마지막 포스트를 가져오고
19
   * 아니면 null을 반환한다.
20
   */
21
  const lastItem = posts.length > 0 ? posts[posts.length - 1] : null
22
  const nexttUrl = lastItem && new URL(`${PROTOCOL}://${HOST}/posts`)
23

24
  /**** dto의 키값들을 루핑하면서
25
   * 키값에 해당되는 벨류가 존재하면, parame에 그대로 붙여넣는다.
26
   * 단, where__id_more_than 값만  lastItem의 마지막 값으로 넣어준다.
27
   */
28
  if (nexttUrl) {
29
    for (const key of Object.keys(dto)) {
30
      if (dto[key]) {
31
        if (key !== 'where__id_more_than') {
32
          nexttUrl.searchParams.append(key, dto[key])
33
        }
34
      }
35
    }
36
    nexttUrl.searchParams.append('where__id_more_than', lastItem.id.toString())
37
  }
38

39
  /*** Response
40
   * data : Data[],
41
   * cursor : {
42
   *  after: 마지막 Data의 ID
43
   * }
44
   * count: 응답한 데이터의 개수
45
   * next: 다음 요청을 할 떄 사용할 URL
46
   */
47
  return {
48
    data: posts,
49
    cursor: {
50
      after: lastItem?.id,
51
    },
52
    count: posts.length,
53
    nest: nexttUrl?.toString(),
54
  }
55
}

1
// posts.service.ts의 paginatePosts 생략
2
/****
3
 * 해당되는 포스트가 0개 이상이면, 마지막 포스트를 가져오고
4
 * 아니면 null을 반환한다.
5
 */
6
const lastItem = posts.length > 0 && posts.length === dto.take ? posts[posts.length - 1] : null
7
const nexttUrl = lastItem && new URL(`${PROTOCOL}://${HOST}/posts`)

1
// posts.service.ts의 paginatePosts 생략
2
/*** Response
3
 * data : Data[],
4
 * cursor : {
5
 *  after: 마지막 Data의 ID
6
 * }
7
 * count: 응답한 데이터의 개수
8
 * next: 다음 요청을 할 떄 사용할 URL
9
 */
10
return {
11
  data: posts,
12
  cursor: {
13
    after: lastItem?.id ?? null,
14
  },
15
  count: posts.length,
16
  nest: nexttUrl?.toString() ?? null,
17
}

1
import { IsIn, IsNumber, IsOptional } from 'class-validator'
2

3
export class PaginatePostDto {
4
  @IsNumber()
5
  @IsOptional()
6
  where__id_less_than?: number
7

8
  /*** 이전 마지막 데이터의 ID
9
   * 이 프로퍼티에 입력된 ID보다 높은 ID부터 값을 가져오기
10
   */
11
  @IsNumber()
12
  @IsOptional()
13
  where__id_more_than?: number
14

15
  /*** 정렬
16
   * createdAt : 생성된 시간의 내림차/오름차 순으로 정렬
17
   */
18
  @IsIn(['ASC', 'DESC']) // 리스트에 있는 값들만 허용
19
  @IsOptional()
20
  order__createAt: 'ASC' | 'DESC' = 'ASC'
21

22
  /*** 갖고올 데이터 개수
23
   * 몇 개의 데이터를 응답으로 받을지
24
   */
25
  @IsNumber()
26
  @IsOptional()
27
  take: number = 20
28
}

1
// posts.service.ts의 paginatePosts 생략
2
/**** dto의 키값들을 루핑하면서
3
 * 키값에 해당되는 벨류가 존재하면, parame에 그대로 붙여넣는다.
4
 * 단, where__id_more_than 값만  lastItem의 마지막 값으로 넣어준다.
5
 */
6
if (nexttUrl) {
7
  for (const key of Object.keys(dto)) {
8
    if (dto[key]) {
9
      if (key !== 'where__id_more_than' && key !== 'where__id_less_than') {
10
        nexttUrl.searchParams.append(key, dto[key])
11
      }
12
    }
13
  }
14
  let key = null
15
  if (dto.order__createAt === 'ASC') {
16
    key = 'where__id_more_than'
17
  } else {
18
    key = 'where__id_less_than'
19
  }
20
  nexttUrl.searchParams.append(key, lastItem.id.toString())
21
}

1
// posts.service.ts의 paginatePosts 생략
2
async paginatePosts(dto: PaginatePostDto) {
3
  const where: FindOptionsWhere<PostsModel> = {}
4

5
  if (dto.where__id_less_than) {
6
    where.id = LessThan(dto.where__id_less_than)
7
  } else if (dto.where__id_more_than) {
8
    where.id = MoreThan(dto.where__id_more_than)
9
  }
10

11
  const posts = await this.postsRepository.find({
12
    where,
13
    order: {
14
      createdAt: dto.order__createAt,
15
    },
16
    take: dto.take,
17
  })
18

19
  // 생략
20
}