앱 라우터: 가이드

앱 라우터: 가이드 | Next.js

출처 URL: https://nextjs.org/docs/app/guides

가이드

마지막 업데이트 2026년 2월 20일

• AI 코딩 에이전트

  • · AI 코딩 에이전트가 오래된 학습 데이터 대신 최신 문서를 사용하도록 Next.js 프로젝트를 구성하는 방법을 알아보세요.

• 분석

  • 애널리틱스 · Next.js Speed Insights를 사용해 페이지 성능을 측정하고 추적하세요.

• 인증

  • · Next.js 애플리케이션에서 인증을 구현하는 방법을 알아보세요.

• 백엔드 포 프론트엔드

  • 백엔드 포 프런트엔드 · Next.js를 백엔드 프레임워크로 사용하는 방법을 알아보세요.

• 캐싱

  • · Next.js의 캐싱 메커니즘을 개괄합니다.

• CI 빌드 캐싱

  • · Next.js 빌드를 캐싱하도록 CI를 구성하는 방법을 알아보세요.

• 콘텐츠 보안 정책

  • · Next.js 애플리케이션에 CSP를 설정하는 방법을 알아보세요.

• CSS-in-JS

  • · Next.js에서 CSS-in-JS 라이브러리를 사용하는 방법을 알아보세요.

• 커스텀 서버

  • · 커스텀 서버를 사용해 Next.js 앱을 프로그래밍 방식으로 시작하세요.

• 데이터 보안

  • · Next.js에 내장된 데이터 보안 기능과 애플리케이션 데이터를 보호하기 위한 모범 사례를 알아보세요.

• 디버깅

  • · VS Code, Chrome DevTools, Firefox DevTools로 Next.js 애플리케이션을 디버깅하는 방법을 알아보세요.

• 드래프트 모드

  • · 정적 페이지와 동적 페이지를 전환하는 Next.js 드래프트 모드를 App Router에서 작동 방식과 함께 알아보세요.

• 환경 변수

  • · Next.js 애플리케이션에서 환경 변수를 추가하고 액세스하는 방법을 배우세요.

• 폼

  • · React Server Actions로 Next.js에서 폼을 만드는 방법을 알아보세요.

• ISR

  • · 증분 정적 재생성을 통해 런타임에 정적 페이지를 생성하거나 업데이트하는 방법을 알아보세요.

• 계측

  • 인스트루멘테이션 · Next.js 앱에서 서버 시작 시 코드를 실행하기 위한 인스트루멘테이션 사용법을 알아보세요.

• 국제화

  • · 다국어 라우팅과 현지화된 콘텐츠로 여러 언어를 지원하세요.

• JSON-LD

  • · 콘텐츠를 검색 엔진과 AI에 설명하기 위해 Next.js 애플리케이션에 JSON-LD를 추가하는 방법을 알아보세요.

• 지연 로딩

  • · 가져온 라이브러리와 React 컴포넌트를 지연 로드해 로딩 성능을 개선하세요.

• 개발 환경

  • · Next.js로 로컬 개발 환경을 최적화하는 방법을 알아보세요.

• Next.js MCP 서버

  • · Next.js MCP 지원을 사용해 코딩 에이전트가 애플리케이션 상태에 접근하도록 설정하는 방법을 알아보세요.

• MDX

  • · MDX를 구성하고 Next.js 앱에서 사용하는 방법을 알아보세요.

• 메모리 사용

  • 량 · 개발과 프로덕션에서 애플리케이션이 사용하는 메모리를 최적화하세요.

• 개요

  • 마이그레이션 · 인기 있는 프레임워크에서 Next.js로 마이그레이션하는 방법을 알아보세요.

• 멀티 테넌트

  • · App Router로 멀티 테넌트 앱을 구축하는 방법을 알아보세요.

• 멀티 존

  • · Next.js 멀티 존으로 여러 Next.js 앱을 단일 도메인에 배포해 마이크로 프런트엔드를 구축하는 방법을 알아보세요.

• OpenTelemetry

  • · OpenTelemetry로 Next.js 앱에 인스트루먼트를 적용하는 방법을 알아보세요.

• 패키지 번들링

  • · Next.js Bundle Analyzer for Turbopack과 Webpack용 @next/bundle-analyzer 플러그인으로 서버 및 클라이언트 번들을 분석하고 최적화하는 방법을 알아보세요.

• 프리페칭

  • 프리패칭 · Next.js에서 프리패칭을 구성하는 방법을 알아보세요.

• 프로덕션

  • · Next.js 애플리케이션을 프로덕션에 배포하기 전에 최고의 성능과 사용자 경험을 보장하기 위한 권장 사항입니다.

• PWA

  • · Next.js로 PWA를 구축하는 방법을 알아보세요.

• 공개 페이지

  • · 랜딩 페이지, 목록 페이지(상품, 블로그 등), 마케팅 및 뉴스 사이트처럼 사용자 간 데이터를 공유하는 공개 “정적” 페이지를 만드는 방법을 알아보세요.

• 리다이렉트

  • 리디렉션 · Next.js에서 리디렉션을 처리하는 다양한 방법을 알아보세요.

• Sass

  • · Sass로 Next.js 애플리케이션을 스타일링하세요.

• 스크립트

  • · 기본 Script 컴포넌트로 서드파티 스크립트를 최적화하세요.

• 셀프 호스팅

  • · Node.js 서버, Docker 이미지 또는 정적 HTML 파일(정적 내보내기)로 Next.js 애플리케이션을 자체 호스팅하는 방법을 알아보세요.

• SPA

  • · Next.js는 단일 페이지 애플리케이션(SPA) 구축을 완전히 지원합니다.

• 정적 내보내기

  • · Next.js는 정적 사이트 또는 SPA로 시작한 뒤 나중에 서버가 필요한 기능을 선택적으로 도입할 수 있게 합니다.

• Tailwind CSS v3

  • · 더 넓은 브라우저 지원을 위해 Tailwind CSS v3로 Next.js 애플리케이션을 스타일링하세요.

• 개요

  • 테스팅 · Cypress, Playwright, Vitest, Jest 네 가지 도구로 Next.js 테스트 환경을 설정하는 방법을 알아보세요.

• 서드파티 라이브러리

  • · @next/third-parties 패키지로 애플리케이션의 서드파티 라이브러리 성능을 최적화하세요.

• 개요

  • 업그레이드 · Next.js 최신 버전으로 업그레이드하는 방법을 알아보세요.

• 동영상

  • 비디오 · Next.js 애플리케이션에서 비디오를 최적화하기 위한 권장 사항과 모범 사례입니다.

보내기