1. 서버 액션(Server Action)이란?
- Next.js의 새로운 기능 중 하나로, 클라이언트 컴포넌트 내부에서 서버로 직접 호출할 수 있는 서버 전용 함수
주요 특징
1. 클라이언트와의 긴밀한 통합
- 클라이언트 컴포넌트 내에서 함수 호출만으로 서버 로직을 실행 가능
- 별도의 API 엔드포인트를 구성할 필요 없이, UI와 밀접하게 연동되는 기능들을 쉽게 구현 가능
2. 보안
- 서버 액션은 서버에서만 실행되기에 민감한 정보가 클라이언트에 노출 방지
- Ex) 폼 제출 시 입력 데이터를 서버에서 직접 처리하여 응답하는 경우
3. 개발 생산성
- 하나의 파일 내에서 클라이언트와 서버 로직을 함께 관리할 수 있기 때문에, 코드 중복을 줄이고 빠른 프로토타이핑이 가능
요약
- UI와 밀접하게 연관된 작업(폼 제출, 간단한 데이터 업데이트 등)
- 클라이언트와 서버 간의 경계를 최소화해 개발하고자 할 때
2. 라우트 핸들러(Route Handler)란?
- Next.js의 파일 기반 라우팅 시스템을 활용하여 API 엔드포인트를 구성하는 방식
- 일반적으로 /app/api 폴더에 파일을 생성해 HTTP 메서드(GET, POST, PUT, DELETE 등)에 따라 서버 사이드 로직을 작성
주요 특징
1. 모듈화된 서버 로직
- UI와 분리된 독립적인 API 엔드포인트를 구성함으로써, 복잡한 비즈니스 로직을 체계적으로 관리 가능
- 파일 기반 라우팅 덕분에 프로젝트의 구조가 명확해질 수 있음
- 즉, 어느 파일이 어떤 역할을 하는지 쉽게 파악 가능
2. 다양한 HTTP 메서드 지원
- 하나의 라우트 파일 내에서 여러 HTTP 메서드를 처리할 수 있어, 복잡한 API 로직이나 다양한 클라이언트 요청을 효과적으로 대응 가능
3. 외부 시스템과의 연동
Next.js 애플리케이션 외부의 다른 서비스(예: 모바일 앱, 다른 웹 애플리케이션)와의 통신에 적합
- RESTful API 서버로서 역할을 수행 가능
** RESTful(Representational State Transfer) : 간결하고 일관된 방식으로 클라이언트와 서버 간의 데이터를 교환할 수 있도록 도와주는 설계 방식
요약
- 독립적인 API 서비스 구축 (여러 클라이언트가 호출할 수 있는 공개 API 제공)
- 복잡한 로직이나 다양한 HTTP 메서드를 필요로 하는 경우
- UI와 서버 로직을 완전히 분리해 관리하고자 할 때
차이점
3. 서버 액션과 라우트 핸들러의 차이점 및 선택 기준
| 구분 | 서버 액션 (Server Action) | 라우트 핸들러 (Route Handler) |
|---|
| 구조 | 컴포넌트 내에 직접 포함 | 파일 기반 API 엔드포인트 |
| 통합성 | UI와 긴밀하게 연동 (단순 작업에 적합) | UI와 분리된 독립적 API, 외부 시스템 연동에 유리 |
| 보안 | 서버에서 실행되어 민감한 정보 노출 위험 낮음 | 서버 사이드에서 실행되어 보안 유지 가능 |
| HTTP 메서드 | 주로 단일 작업 (폼 제출 등) | 다양한 HTTP 메서드(GET, POST, PUT, DELETE 등) 지원 |
| 개발 생산성 | 빠른 프로토타이핑과 코드 통합 | 모듈화된 코드 관리로 유지보수 용이 |
결론
서버 액션 :
- UI와 긴밀하게 연동된 간단한 작업을 신속하게 처리하고자 할 때 유용
라우트 핸들러 :
- 독립적인 API를 구성해 외부 시스템과의 통신이나 복잡한 로직을 모듈화하여 관리할 때