# nextjs-ci-quality-gates

> CI quality gates for Next.js (App Router): standard package.json scripts (format/lint/typecheck/unit/build), GitHub Actions PR gating, optional Playwright E2E, branch protection expectations, and nightly/recurring maintenance jobs. Use when setting up or reviewing GitHub Actions CI for Next.js + pnpm and when adding guardrails for App Router boundary drift ("use client" growth, fetch no-store sprawl).

- Author: hidemi-ito
- Repository: hidemi-ito/skills
- Version: 20260209230119
- Stars: 0
- Forks: 0
- Last Updated: 2026-02-09
- Source: https://github.com/hidemi-ito/skills
- Web: https://mule.run/skillshub/@@hidemi-ito/skills~nextjs-ci-quality-gates:20260209230119

---

---
name: nextjs-ci-quality-gates
author: hidemi-ito
description: 'CI quality gates for Next.js (App Router): standard package.json scripts (format/lint/typecheck/unit/build), GitHub Actions PR gating, optional Playwright E2E, branch protection expectations, and nightly/recurring maintenance jobs. Use when setting up or reviewing GitHub Actions CI for Next.js + pnpm and when adding guardrails for App Router boundary drift ("use client" growth, fetch no-store sprawl).'
---

# Next.js CI / Quality Gates

目的: CI構成を “3層” に分けて安定運用する。

- PR品質ゲート（必須）
- main保護（必須設定）
- 夜間/定期（任意だが効く）

## 1) scripts を先に固定する（ローカルとCIを一致させる）

`package.json` の例は `nextjs-ci-quality-gates/references/package-scripts.md`。

ルール:

- `lint` は `eslint .` を直接回す（CI/ローカルで同じ挙動にする）。
- `typecheck` は `tsc --noEmit` の専用ゲートを用意し、`build` に依存させない。
- `ci` は “CIで回す順序” を固定した合成コマンドにする。

## 2) GitHub Actions テンプレ

テンプレは `nextjs-ci-quality-gates/assets/github/workflows/` に置く。

- `ci.yml`: PR/Pushで format + lint + typecheck + unit + build
- `e2e.yml`: 影響が大きい変更だけPlaywright（pathsで絞る）
- `nightly.yml`: 夜間フルE2E/キャッシュ無しビルド等（任意）

## 3) ブランチ保護（CIとセット）

GitHub の Branch protection rules で以下を前提に運用する:

- 必須ステータスチェック: `CI`（+必要なら`E2E`）
- PRレビュー必須（例: 1-2名）
- 会話解決必須（未解決コメントがあるとmerge不可）
- 管理者バイパス禁止（運用次第だが推奨）

## 4) テスト戦略の規約（最小で効くルール）

方針:

- Unit（多め）: 純粋関数、validator、ドメインロジック
- Integration（必要分）: Route Handlers / Server Actions / I/O境界
- E2E（少数固定）: 主要ユーザーフローだけ、flaky放置禁止

詳細は `nextjs-ci-quality-gates/references/testing-strategy.md`。

## 5) App Router 境界のガードレール（任意）

PRで `\"use client\"` や `no-store` が増えたらレビュー必須、という運用を入れる。

- 目視レビュー用: `rg '\"use client\"' src -n`
- 自動チェック例: `nextjs-ci-quality-gates/scripts/app-router-guardrails.sh`