Communitygithub.com

BIGboss248/nextjs-wordpress

在 Next.js App Router 應用程式中設定生產環境健康監控端點 (/api/health)、Docker Compose 探測檢查與執行時期指標。當被要求「設定健康檢查」、「加入健康端點」、「docker compose healthcheck nextjs」、「設定健康監控」或「/nextjs-healthcheck」時使用。

nextjs-wordpress 是什麼?

這是一個模組化、生產就緒的技能,專門用於在 Next.js App Router 應用程式中建立與維護健康檢查端點、Docker Compose 健康探測以及 Node.js 執行時期指標。它能自動掃描專案中的資料庫依賴(如 Prisma、Drizzle、Mongoose)與 Docker Compose 檔案,並根據有無資料庫生成對應的 /api/health 路由處理器模板。此技能特別強調避免常見陷阱:強制使用 force-dynamic 防止路由被靜態快取、為資料庫查詢設定嚴格的 2 秒逾時、以及使用 Node.js 原生 fetch 而非 curl 來實作容器健康檢查,以確保在精簡容器映像中也能正常運作。支援的平台包括 Next.js App Router 專案與 Docker Compose 環境,適合用於 CI/CD 驗證或生產環境的即時監控。完成設定後會產出結構化摘要報告,包含路由路徑、資料庫探測設定、執行時期指標與 Docker Compose 更新狀態。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/BIGboss248/nextjs-wordpress/tree/HEAD/.agents/skills/nextjs-healthcheck

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

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 或其他 compose 堆疊。請參考 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 狀態碼規範:健康/降級狀態回傳 200 OK,不健康狀態回傳 503 Service Unavailable。

3. 設定 Docker Compose 健康探測

  • 識別 Next.js 服務:檢查偵測到的 compose 檔案中是否有 Next.js 服務區塊(nextjs-app、web、app)。
  • 注入健康檢查區塊:從 docker-compose.healthcheck.template.yml 加入零依賴的 Node.js fetch 健康探測。

4. 驗證與測試

  • 本機 API 測試:
    curl -i http://localhost:3000/api/health
    
    驗證回傳 HTTP 200 以及有效的 JSON 負載(status、timestamp、uptimeSeconds、checks)。
  • Compose 健康狀態檢查:
    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.js 原生 fetch(透過 node -e)。
  • 機密洩漏:絕對不要在公開的 /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...

相關技能