Communitygithub.com

Next.js Health Check & Observability Skill (nextjs-healthcheck)

Next.js App Router 애플리케이션에 프로덕션 등급의 헬스 체크 엔드포인트(/api/health), Docker Compose 프로브, 런타임 메트릭을 설정합니다.

Next.js Health Check & Observability Skill (nextjs-healthcheck)란 무엇인가요?

이 스킬은 Next.js App Router 프로젝트에서 /api/health 엔드포인트, Docker Compose 헬스 프로브, Node.js 런타임 메트릭을 자동으로 설정하고 유지 관리하는 모듈식의 프로덕션 지원 워크플로우를 제공합니다. 프로젝트의 데이터베이스 사용 여부를 감지하고 적절한 라우트 핸들러 템플릿을 배포하며, Docker Compose 파일에 제로-의존성 Node.js fetch 프로브를 주입합니다. 이를 통해 개발자는 일관된 상태 코드(200/503), 강제 동적 실행, 캐시 무효화 헤더, V8 힙 사용률 및 이벤트 루프 지연과 같은 비차단 메트릭을 보장받을 수 있습니다. 이 스킬은 Claude Code, Cursor, Codex와 같은 AI 에이전트와 함께 사용하도록 설계되었으며, '헬스 체크 설정', '헬스 엔드포인트 추가', 'docker compose healthcheck nextjs' 등과 같은 프롬프트에 응답합니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/BIGboss248/nextjs-wordpress/tree/HEAD/.agents/skills/nextjs-healthcheck

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

Next.js 헬스 체크 및 관측 가능성 스킬 (nextjs-healthcheck)

Next.js App Router 애플리케이션에 걸쳐 헬스 체크 엔드포인트 (/api/health), 제로-의존성 Docker Compose 헬스 프로브, Node.js 런타임 메트릭을 생성하고 유지 관리하기 위한 모듈식의 프로덕션 지원 워크플로우입니다.


워크플로우 개요

flowchart TD
    A["1. 프로젝트 스캔<br/>(데이터베이스 및 Docker Compose)"] --> B["2. /api/health 생성<br/>(메트릭이 포함된 템플릿)"]
    B --> C["3. Docker 프로브 주입<br/>(docker-compose.yml)"]
    C --> D["4. 확인 및 검증<br/>(curl 및 docker compose ps)"]

단계별 실행 런북

순차적으로 이 체크리스트를 따라 애플리케이션 헬스 모니터링을 구현하고 확인합니다:

1. 프로젝트 탐색 및 의존성 검사

  • 라우트 핸들러 경로 찾기: 프로젝트가 app/ 또는 src/app/ 디렉토리를 사용하는지 확인합니다 (대상: app/api/health/route.ts 또는 src/app/api/health/route.ts).
  • 데이터베이스 / 외부 저장소 감지: package.json에서 ORM 및 클라이언트(Prisma, Drizzle, Supabase, Mongoose, PostgreSQL, Redis)를 스캔합니다. database-probes.md를 참조하세요.
  • Docker Compose 파일 찾기: docker-compose.yml, docker-compose.prod.yml 또는 기타 컴포즈 스택을 발견합니다. docker-compose-probes.md를 참조하세요.

2. 헬스 체크 라우트 핸들러 구현

  • 라우트 템플릿 선택:
  • 동적 실행 강제: export const dynamic = "force-dynamic"; 및 Cache-Control: no-store, no-cache, must-revalidate 헤더가 있는지 확인합니다.
  • 비차단 메트릭 구성: V8 힙 사용률, 이벤트 루프 지연 (perf_hooks를 통한 $p99$ 지연), 프로세스 가동 시간을 수집합니다. status-and-metrics.md를 참조하세요.
  • HTTP 상태 코드 규칙 강제: healthy/degraded 상태는 200 OK, unhealthy 상태는 503 Service Unavailable을 반환합니다.

3. Docker Compose 헬스 프로브 구성

  • Next.js 서비스 식별: 감지된 컴포즈 파일에서 Next.js 서비스 블록 (nextjs-app, web, app)을 검사합니다.
  • 헬스체크 블록 주입: docker-compose.healthcheck.template.yml에서 제로-의존성 Node.js fetch 헬스 프로브를 추가합니다.

4. 확인 및 테스트

  • 로컬 API 테스트:
    curl -i http://localhost:3000/api/health
    
    유효한 JSON 페이로드 (status, timestamp, uptimeSeconds, checks)와 함께 HTTP 200 응답을 확인합니다.
  • 컴포즈 헬스 상태 확인:
    docker compose ps
    
    초기 시작 기간 후 서비스 상태가 (healthy)로 전환되는지 확인합니다.

엣지 케이스 및 알려진 AI 함정

[!WARNING]

  • force-dynamic 누락: export const dynamic = "force-dynamic"이 생략되면 Next.js App Router가 라우트 응답을 정적으로 평가하거나 캐시하여 타임스탬프가 고정되고 가동 시간 메트릭이 멈출 수 있습니다.
  • 데이터베이스 연결 중단: 타임아웃(최대 2000ms) 없이 외부 데이터베이스를 쿼리하지 마십시오. 처리되지 않은 네트워크 지연은 요청 풀 고갈로 이어질 수 있습니다.
  • 컨테이너 내 외부 도구 의존성: Docker 헬스 체크에서 curl 또는 wget에 의존하지 마십시오. 프로덕션 최소 이미지(예: node:alpine 또는 distroless)에는 이러한 도구가 없는 경우가 많습니다. node -e를 통해 Node.js 네이티브 fetch를 사용하세요.
  • 비밀 정보 유출: 공개 /api/health 응답 페이로드에 데이터베이스 연결 URL, 비밀번호 또는 내부 원시 오류 추적을 절대 출력하지 마십시오.

출력 요약 스키마

헬스 체크 설정이 완료되면 간결한 요약 보고서를 제공합니다:

### 헬스 모니터링 구성 완료

- **라우트 핸들러**: `[app/api/health/route.ts](file:///...)`
- **데이터베이스 프로브**: [구성됨: Prisma / Drizzle / 없음] (타임아웃: 2000ms)
- **런타임 메트릭**: V8 힙 사용률 및 이벤트 루프 지연 (p99)
- **업데이트된 Docker Compose 스택**: `docker-compose.yml`, `docker-compose.prod.yml`
- **확인 상태**: 통과 (HTTP 200 / 컨테이너 정상)

참고 가이드 및 템플릿

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

BIGboss248/nextjs-wordpress

Create, configure, manage, and validate Google Antigravity customizations including skills, rules, MCP servers, lifecycle hooks, plugins, and custom JSON configs. Use when adding new capabilities to Antigravity, configuring MCP servers, writing rules, creating skills, setting up hooks, or modernizing legacy workflows.

BIGboss248/nextjs-wordpress

Spawn multiple agents into a shared conversation where they debate, disagree, and converge on a solution via a shared chat.json file. Use for architecture decisions, code review debates, design trade-offs, or any problem that benefits from adversarial reasoning. Triggers on "chatroom", "agent debate", "have agents discuss", "agent chatroom", "debate this", or /agent-chatrooms. Also triggers on phrases like "have 3 agents argue about", "multi-agent discussion", or "let them debate".

BIGboss248/nextjs-wordpress

Always-active code intelligence, search, and navigation skill utilizing the codebase-memory MCP server. Enforces an index-first protocol (verifying and refreshing the knowledge graph via index_repository or index_status before searching, required because background auto_watch is disabled to eliminate editor stutter and system lag), followed by graph-first exploration (search_graph, trace_path, get_code_snippet, query_graph, get_architecture, detect_changes) instead of naive text grep or full-file reads. Always activate before searching the codebase, inspecting unknown architecture, finding symbols, or tracing callers/callees.

BIGboss248/nextjs-wordpress

>- Discover, interview, and craft comprehensive UX/UI design specifications (design-spec.md) and design tokens for web components. Triggers on "/component-design", "design component", "design section", "design UI", "wireframe component", or "create design spec".

BIGboss248/nextjs-wordpress

>- Configure and query WooCommerce APIs including WPGraphQL, WooGraphQL, and JWT auth for headless frontends. Use when connecting Next.js to WooCommerce or fetching store catalog data.

BIGboss248/nextjs-wordpress

Orchestrate parallel browser automation using multiple Chrome DevTools MCP instances. Use when a task requires doing the same browser action across many targets simultaneously (e.g., submitting contact forms, filling applications, scraping pages that need JS rendering). Spin up 1-5 parallel Chrome agents.

BIGboss248/nextjs-wordpress

Workflow for spawning an independent subagent to conduct unbiased code reviews and inject adversarial edge-case tests ([ComponentName].edge.test.tsx).

BIGboss248/nextjs-wordpress

>- Build Next.js App Router React components with Suspense skeletons, semantic OKLCH tokens, Jest + RTL unit tests, Playwright visual/hydration checks, and Tailwind logical styling. Triggers on "/nextjs-component-dev", "create component", "new component", "build component", or "develop component".

BIGboss248/nextjs-wordpress

>- Bootstrap, configure, and verify the complete Next.js App Router development environment, developer tooling, testing suites, MCP servers, Docker containerization, and CI/CD. Triggers on "/nextjs-dev-setup", "setup nextjs dev environment", "start a nextjs project", or "containerize nextjs app".

BIGboss248/nextjs-wordpress

Bootstrap, configure, and verify next-intl App Router internationalization (proxy.ts/middleware.ts, next/root-params, [locale] layout, routing). Triggers on "/nextjs-i18n-setup", "setup i18n", "install next-intl", "configure next-intl", "add internationalization", "setup locale routing", "migrate to [locale]".

BIGboss248/nextjs-wordpress

Read/write translation dictionaries (messages/[locale].json), next-intl hooks (getTranslations/useTranslations), providers (Storybook/tests/subtrees), and BiDi styling. Triggers on "/nextjs-i18n-usage", "i18n dictionary", "use translations", "read dictionary", "i18n provider", "next-intl hooks", "storybook i18n", "test i18n", "add translation keys", "localize component", "create a component", "update a component".

BIGboss248/nextjs-wordpress

>- Configure, test, and verify OpenTelemetry (OTel) observability in Next.js App Router applications. Triggers on "/nextjs-otel", "setup otel", "configure opentelemetry", "test otel", or "verify opentelemetry".

BIGboss248/nextjs-wordpress

Step-by-step workflow for designing and building Next.js App Router pages (RSC page.tsx, loading skeleton, metadata, JSON-LD schema, and dynamic static params). Triggers on "/nextjs-page-dev", "create page", "new page", "develop page", "build route", or "implement page".

BIGboss248/nextjs-wordpress

>- Orchestrate end-to-end planning for Next.js App Router projects, generating canonical specifications, design systems, and a 7-phase modular implementation roadmap in docs/plan/. Triggers on "/nextjs-plan", "plan a nextjs project", "plan nextjs app", "create nextjs project plan", "outline nextjs architecture", or "generate plan".

BIGboss248/nextjs-wordpress

Workflow and engineering standards for crafting co-located Storybook CSF3 stories ([ComponentName].stories.tsx) with interactive controls, action spies, and 4 canonical theme variants.

BIGboss248/nextjs-wordpress

>- Build Next.js e-commerce frontends backed by WooCommerce APIs, handling ISR catalogs, cart sessions, and JWT authentication. Use when building or querying Next.js stores with WooCommerce.

BIGboss248/nextjs-wordpress

Self-correcting rules engine and feedback loop that learns from user corrections, mistakes, and project-specific constraints by maintaining a persistent autofix ruleset. Scans learned rules before starting any task, resolves conflicts, and automatically appends new rules upon corrections. Triggers on user corrections ("no, do it this way", "never do X", "always use Y"), /learn, "self repair", "add rule", "update rules", or when diagnosing assumptions and bugs. CRITICAL ALWAYS-ACTIVE LIFECYCLE SKILL. Must always be kept in context, loaded at session start, and consulted before starting ANY task to read and apply active constraints from autofix.json. MUST ALWAYS be triggered immediately whenever the user provides ANY correction, preference, criticism, rejection of an approach, or adjustment ("no", "don't do X", "use Y", "remember", "prefer"), or when any mistake/bug is identified. Automatically and immediately formulates and appends the new imperative rule to the project's autofix.json ruleset file.

BIGboss248/nextjs-wordpress

Setup, automate, and execute SEO audits, CI/CD pre-push/pre-deploy checks, and ranking optimizations using the seo CLI and MCP server.

BIGboss248/nextjs-wordpress

End-to-end repository onboarding and development environment setup skill. Scans repository structure, configures project metadata (docs/project.json), sets up the codebase-memory-mcp code intelligence knowledge graph server (in workspace mcp.json and globally for AGY only), configures git hooks with Husky and Commitlint, establishes multi-stage production Docker containerization, and automates credit-optimized Release Please CI/CD with multi-arch (AMD64 & ARM64) GHCR package deployment. Triggers on "/setup-repository", "setup repository", "setup repo", "initialize repository", "new repo setup", or when preparing any repository for development and AI agent workflows.

BIGboss248/nextjs-wordpress

AI screen scaffolding, layout generation, and variant exploration workflow powered by Google Stitch (StitchMCP). Consumes a component design specification (docs/design/components/[page name]/[component name]/design-spec.md), verifies and reuses the central Stitch project in docs/project.json (or creates/persists one if absent), seeds the project's design system into Stitch, synthesizes layout prompts to generate a screen and create one variant of the given design spec file, downloads and saves Stitch JPG screenshots and HTML code files directly into docs/design/components/[page name]/[component name]/stitch/ using binary-safe PowerShell Invoke-WebRequest, outputs image prompts to the user if visual assets are needed (without calling generate_image to conserve tokens), updates design-spec.md with Stitch layout benchmarks, and audits asset download integrity with an independent subagent. Triggers on "/stitch-design", "generate stitch screen", "create stitch variant", "scaffold screen with stitch", or "stitch...

관련 스킬