Route Handler

오늘은 라우트 핸들러에 대해 학습해보겠습니다.

 

먼저 Route Handler란 특정 URL 경로(route)로 들어오는 요청을 처리하는 함수입니다. 쉽게 말해서 "특정 주소로 요청이 왔을 때 어떻게 응답할지 정의하는 함수"라고 생각하면 됩니다.

 

// courses/route.ts
import { NextResponse } from 'next/server'

// GET /api/courses
export async function GET() {
  try {
    // 1. 데이터베이스에서 모든 강의 정보를 가져옴
    const courses = await prisma.course.findMany({
      where: { isActive: true }
    });

    // 2. 클라이언트에게 JSON 형태로 응답
    return NextResponse.json({ courses })
  } catch (error) {
    // 3. 에러가 발생하면 에러 응답
    return NextResponse.json(
      { error: "강의 정보를 가져오는데 실패했습니다" },
      { status: 500 }
    )
  }
}

 

 

 

실제 예시를 들어보겠습니다.

 

 

1. 강의 목록 조회

// GET /api/courses
export async function GET(request: Request) {
  // URL에서 검색어 파라미터 추출
  const { searchParams } = new URL(request.url);
  const query = searchParams.get('query');

  const courses = query 
    ? await searchCourses(query)  // 검색어가 있으면 검색
    : await getAllCourses();      // 없으면 전체 목록

  return NextResponse.json({ courses });
}

 

 

 

 

 

2. 특정 강의 상세 정보 조회

// GET /api/courses/[courseId]
export async function GET(
  request: Request,
  { params }: { params: { courseId: string } }
) {
  const course = await getCourseById(params.courseId);
  
  if (!course) {
    return NextResponse.json(
      { error: "강의를 찾을 수 없습니다" },
      { status: 404 }
    );
  }

  return NextResponse.json({ course });
}

 

 

 

 

 

3. 새로운 강의 등록

// POST /api/courses
export async function POST(request: Request) {
  const data = await request.json();

  // 새 강의 등록
  const newCourse = await createCourse(data);

  return NextResponse.json({ 
    message: "강의가 등록되었습니다",
    course: newCourse 
  });
}

 

 

 

 

 

이것을 실제 웹사이트에서는 이렇게 사용합니다.

 

// 강의 목록 가져오기
const response = await fetch('/api/courses');
const { courses } = await response.json();

// 검색
const response = await fetch('/api/courses?query=파이썬');
const { courses } = await response.json();

// 특정 강의 정보 가져오기
const response = await fetch('/api/courses/123');
const { course } = await response.json();

 

 

이런 구조의 장점은:

1. 서버 로직과 클라이언트 로직이 깔끔하게 분리됨
2. 동일한 API를 여러 페이지에서 재사용할 수 있음
3. API 응답을 캐싱하거나 에러 처리하기 쉬움