02편에서 컴퓨트 인스턴스가 트래픽에 따라 여러 개로 늘어나고, 각 인스턴스의 메모리가 서로 격리된다는 원리를 배웠습니다. 이 원리는 Next.js가 관리하는 캐시(06~08편)뿐 아니라, 애플리케이션이 직접 관리하는 상태에도 똑같이 적용됩니다. 이번 편에서는 공지사항 조회수라는 흔한 기능을 예로 들어, 그 상태가 인스턴스마다 따로 노는 것을 직접 확인합니다.

이 편에서 만드는 파일

notice-board/
├── lib/
│   └── view-counts.js                    (+, 모듈 스코프 Map 기반 조회수 저장소)
└── app/
    └── api/
        └── notices/
            └── [id]/
                └── views/
                    └── route.js           (+, 조회수 증가 API. 인스턴스 식별자 포함 응답)

개념 정리

조회수는 Next.js 캐시가 아니라 애플리케이션 상태다

06~08편에서 다룬 데이터 캐시·전체 라우트 캐시는 Next.js가 fetch·revalidate 옵션을 보고 알아서 관리합니다. 조회수는 다릅니다. “공지사항을 열람할 때마다 1을 더한다”는 로직은 애플리케이션 코드가 직접 관리하는 상태이고, Next.js 캐시 API를 전혀 거치지 않습니다. 이번 편은 이 상태를 가장 단순한 방법인 모듈 스코프 Map으로 구현합니다.

모듈 스코프 Map도 02편의 표 그대로다

lib/view-counts.js에 선언한 Map은 그 모듈을 불러온 컴퓨트 인스턴스의 메모리 안에만 존재합니다. 인스턴스가 여러 개면, 같은 공지사항의 조회수를 물어도 인스턴스마다 다른 숫자가 돌아옵니다.

응답에 인스턴스 식별자를 함께 실어 보내기

process.pid(현재 프로세스 번호)를 응답에 함께 담으면, 어느 인스턴스가 이 요청에 응답했는지 구분할 수 있습니다. 조회수 값과 인스턴스 식별자를 나란히 놓고 보면, “이 조회수는 어느 인스턴스의 Map에 있던 값인가”를 바로 알 수 있습니다.

이 표 때문에 이번 편의 재현 실습은 로컬이 아니라 04편에서 배포한 Amplify URL을 대상으로 합니다.

실습

// lib/view-counts.js
const viewCounts = new Map();
 
export function bumpViewCount(noticeId) {
  const current = viewCounts.get(noticeId) ?? 0;
  const next = current + 1;
  viewCounts.set(noticeId, next);
  return next;
}

// app/api/notices/[id]/views/route.js
import { NextResponse } from 'next/server';
import { bumpViewCount } from '../../../../../lib/view-counts.js';
 
export async function POST(request, { params }) {
  const { id } = await params;
  const views = bumpViewCount(id);
  const instanceId = process.pid;
 
  return NextResponse.json(
    { id, views, instanceId },
    { headers: { 'x-instance-id': String(instanceId) } },
  );
}

for i in $(seq 1 20); do
  curl -s -X POST "https://main.d1234567890abc.amplifyapp.com/api/notices/1/views" &
done
wait

직접 해보기

1. seq 1 20을 seq 1 5로 바꿔 요청 수를 줄여서 실행해 봅니다. 인스턴스 식별자가 하나로만 잡힌다면, 트래픽이 적어 인스턴스가 늘어나지 않은 것입니다.

2. 공지사항 ID를 1에서 2로 바꿔 같은 반복 요청을 실행해 봅니다. 1번 공지의 조회수와 2번 공지의 조회수가 서로 다른 키로 완전히 독립적으로 늘어나는지 확인합니다.

자주 하는 실수

확인 문제

참고 자료

• AWS Amplify Docs — Amplify support for Next.js 
• Node.js Docs — process.pid