프론트엔드 개발 · 중급
Next.js Middleware(`middleware.ts`)에서 특정 경로들만 미들웨어를 거치도록 적용 대상을 필터링하는 설정 객체의 속성 이름은 무엇인가요?
힌트 · config 객체의 `matcher` 속성 배열에 정규식이나 경로 문자열을 지정합니다.
matcher경로정규식
모범답안
Next.js 미들웨어에서 특정 경로에만 적용되도록 필터링하는 설정 객체의 속성은 matcher입니다. middleware.ts 파일에서 config 객체를 정의하고, 그 안에 matcher 속성을 배열 형태로 지정하여 적용할 경로를 설정할 수 있습니다.
matcher 배열 안에는 문자열 경로 또는 정규식을 사용할 수 있습니다. 예를 들어, /about 경로와 /blog/:path* 경로에만 미들웨어를 적용하고 싶다면 다음과 같이 설정할 수 있습니다.
export const config = {
matcher: ['/about', '/blog/:path*'],
};
이렇게 설정하면 지정된 경로에 접근할 때만 미들웨어가 실행되고, 다른 경로에서는 실행되지 않습니다. 정규식을 사용하면 더욱 복잡한 패턴 매칭도 가능합니다.
읽었다면, 이제 직접 답해볼 차례예요
패스잇 앱에서 이 질문에 말로 답하면 AI가 꼬리질문까지 이어가며 1:1 코칭합니다.
함께 보는 Next.js 면접 질문
- Client Component 경계 내부에서 Server Component를 직접 import하여 자식으로 사용할 때 발생하는 문제는 무엇이며, 이를 우회하는 패턴은 무엇인가요?
- App Router 환경에서 fetch API를 사용할 때, 캐싱을 비활성화하고 매 요청마다 서버에서 동적으로 데이터를 가져오게 하려면 옵션을 어떻게 설정하나요?
- App Router에서 특정 경로의 동적 렌더링 여부를 파일 레벨에서 강제하기 위해 export하는 Route Segment Config 변수와 값은 무엇인가요?
- Middleware 파일 내부에서 조건부로 사용자를 로그인 페이지로 리다이렉트 시키려면 어떤 클래스의 메서드를 반환해야 하나요?
- App Router의 Route Handlers(`app/api/route.ts`)에서 동적 라우팅 파라미터(예: `[id]`)에 접근하려면 함수의 매개변수를 어떻게 정의해야 하나요?
- RSC Payload(React Server Component Payload) 내부 구조는 대략적으로 어떤 형태로 구성되어 있나요?