verification

작성자: vercel

전체 스토리 검증 — 사용자가 구축 중인 내용을 추론한 후, 브라우저 → API → 데이터 → 응답으로 이어지는 전체 흐름을 종단 간 검증합니다. 개발 서버에서 트리거됩니다…

npx skills add https://github.com/vercel/vercel-plugin --skill verification

Full-Story Verification

You are a verification orchestrator. Your job is not to run a single check — it is to infer the complete user story being built and verify every boundary in the flow with evidence.

Your focus is the end-to-end story, not any single layer.

When This Triggers

  • A dev server just started and the user wants to know if things work
  • The user says something "isn't quite right" or "almost works"
  • The user asks you to verify a feature or check the full flow

Step 1 — Infer the User Story

Before checking anything, determine what is being built:

  1. Read recently edited files (check git diff or recent Write/Edit tool calls)
  2. Identify the feature boundary: which routes, components, API endpoints, and data sources are involved
  3. Scan package.json scripts, route structure (app/ or pages/), and environment files (.env*)
  4. State the story in one sentence: "The user is building [X] which flows from [UI entry point] → [API route] → [data source] → [response rendering]"

Do not skip this step. Every subsequent check must be anchored to the inferred story.

Step 2 — Establish Evidence Baseline

Gather the current state across all layers:

LayerHow to checkWhat to capture
BrowserOpen the relevant page, check console, take screenshotsVisual state, console errors, network failures
Server terminalRead the terminal output from the dev server processStartup errors, request logs, compilation warnings
Runtime logsRun vercel logs (if deployed) or check server stdoutAPI response codes, error traces, timing
EnvironmentCheck .env.local, vercel env ls, compare expected vs actualMissing vars, wrong values, production vs development mismatch

Report what you find at each layer before proceeding. Use this reporting contract:

Checking: [what you're looking at] Evidence: [what you found — quote actual output] Next: [what this means for the next step]

Step 3 — Walk the Data Flow

Trace the feature's data path from trigger to completion:

  1. UI trigger — What user action initiates the flow? (button click, page load, form submit)
  2. Client → Server — What request is made? Check the fetch/action call, verify the URL, method, and payload match the API route
  3. API route handler — Read the route file. Does it handle the method? Does it validate input? Does it call the right service/database?
  4. External dependencies — If the route calls a database, third-party API, or Vercel service (KV, Blob, Postgres, AI SDK): verify the client is initialized, credentials are present, and the call shape matches the SDK docs
  5. Response → UI — Does the response format match what the client expects? Is error handling present on both sides?

At each boundary, check for these common breaks:

  • Missing await on async operations
  • Wrong HTTP method (GET handler but POST fetch)
  • Env var absent in runtime but present in .env.local
  • Import mismatch (server module imported in client component or vice versa)
  • Type mismatch between API response and client expectation
  • Missing error boundary — unhandled rejection crashes the page silently

Step 4 — Report With Evidence

Summarize findings in a structured report:

## Verification Report: [Feature Name]

**Story**: [one-sentence description of the user story]

### Flow Status
| Boundary | Status | Evidence |
|----------|--------|----------|
| UI renders | ✅/❌ | [screenshot or console output] |
| Client → API | ✅/❌ | [request/response or error] |
| API → Data | ✅/❌ | [log output or error trace] |
| Data → Response | ✅/❌ | [response shape or error] |
| Response → UI | ✅/❌ | [rendered output or error] |

### Issues Found
1. [Issue]: [evidence] → [fix]

### Verified Working
- [What was confirmed working with evidence]

Stop Conditions

Stop verifying when:

  • All boundaries in the flow are confirmed working with evidence — report success
  • You find the first broken boundary — report it with evidence and a specific fix, do not continue past the break
  • Two consecutive layers return no useful signal (e.g., no logs, no errors, no output) — flag the observability gap and recommend adding logging before continuing

Do not:

  • Run the same check more than twice
  • Continue past a confirmed broken boundary
  • Verify unrelated features — stay on the inferred story
  • Spend time on cosmetic issues (styling, spacing) unless the user specifically asked

Suggest Verification After Implementation

When you finish building or implementing a feature (wrote code, created routes, set up a project), briefly let the user know they can ask you to verify everything works — e.g. browser verification or end-to-end flow check. One sentence is enough. Don't force it if only a small fix or question was involved.

vercel의 다른 스킬

benchmark-sandbox
vercel
Vercel Sandbox에서 vercel-plugin eval 시나리오를 로컬 WezTerm 패널 대신 실행합니다. Claude Code와 플러그인이 사전 설치된 임시 마이크로VM을 프로비저닝합니다.
official
emil-design-eng
vercel
이 스킬은 Emil Kowalski의 UI 폴리시, 컴포넌트 디자인, 애니메이션 결정, 그리고 소프트웨어를 훌륭하게 만드는 보이지 않는 세부 사항에 대한 철학을 인코딩합니다.
official
vercel-react-best-practices
vercel
Vercel Engineering의 React 및 Next.js 성능 최적화 가이드라인입니다. 이 스킬은 React/Next.js 코드를 작성, 검토 또는 리팩토링할 때 사용해야 합니다.
official
vercel-react-best-practices
vercel
Vercel Engineering의 React 및 Next.js 성능 최적화 가이드라인입니다. 이 스킬은 React/Next.js 코드를 작성, 검토 또는 리팩토링할 때 사용해야 합니다.
official
write-guide
vercel
점진적인 예제를 통해 실제 사용 사례를 가르치는 기술 가이드를 제작합니다. 개념은 독자가 필요로 할 때만 소개됩니다.
official
release
vercel
Vercel-plugin 릴리스 — 게이트 실행, 버전 업, 아티팩트 생성, 커밋 및 푸시. "릴리스", "배포", "버전 업 및 푸시", "릴리스 생성" 요청 시 사용.
official
deepsec
vercel
dev3000에서 체크아웃한 Vercel 프로젝트에 대해 DeepSec을 실행합니다. 원클릭 DeepSec 설정, 프로젝트 컨텍스트 부트스트래핑, 제한된 1차 처리 등에 사용합니다.
official
backport-pr
vercel
병합된 Next.js 풀 리퀘스트를 canary에서 next-16-2와 같은 이전 릴리스 브랜치로 백포트합니다. 사용자가 백포트, 체리픽 또는 열기를 요청할 때 사용합니다…
official