Route Handlers (API Routes)

App Router의 새로운 API Routes 패턴을 학습합니다.

🛣️ Route Handlers란?

Pages Router의 API Routes를 대체하는 새로운 방식입니다.route.ts 파일로 정의합니다.

// app/api/hello/route.ts
export async function GET() {
  return Response.json({ message: 'Hello!' });
}

export async function POST(request: Request) {
  const body = await request.json();
  return Response.json({ data: body });
}

📡 GET 요청 테스트

📮 POST 요청 테스트

🔧 지원하는 HTTP 메서드

GET

데이터 조회

POST

데이터 생성

PUT

데이터 전체 수정

PATCH

데이터 일부 수정

DELETE

데이터 삭제

HEAD

헤더만 조회

OPTIONS

CORS preflight

📝 동적 라우트

// app/api/posts/[id]/route.ts
export async function GET(
  request: Request,
  { params }: { params: { id: string } }
) {
  const id = params.id;
  return Response.json({ postId: id });
}

URL: /api/posts/123
params.id: 123

🔍 Query Parameters

export async function GET(request: Request) {
  const { searchParams } = new URL(request.url);
  const query = searchParams.get('q');
  
  return Response.json({ query });
}

URL: /api/search?q=nextjs
query: nextjs

💡 Route Handlers vs Server Actions

특성	Route Handlers	Server Actions
용도	RESTful API 엔드포인트	폼 처리 및 mutation
호출 방법	fetch(), axios 등	직접 함수 호출
파일 위치	app/api/*/route.ts	어디서나 (use server)