FixWeb

// docs / ai fix prompts

AI improvement prompts

Every finding has a Copy prompt button beneath the remediation. Click it, paste into Claude / Cursor / Copilot, and the agent gets the canonical improvement recipe for that website-quality issue — no Claude API call from us.

작동 방식

클릭하면 두 가지 데이터가 결합됩니다.

  • Finding — 보고서에 이미 로드된 title, description, evidence, remediation, CWE입니다.
  • 코드베이스 framework — scan의 discovery.tech-fingerprint finding에서 감지합니다(Next.js, React, Vue, Django, Express, Rails, Laravel, Flask). framework를 감지하지 못하면 generic recipe로 fallback합니다(그 경우 agent prompt가 repo 상태에서 직접 감지하도록 LLM에 요청합니다).

Templates live in lib/scanner/fix-prompts.ts. The registry has check-specific guidance for crawlability, search presentation, semantic content, structured data, media, performance, accessibility, forms, mobile/i18n, runtime, owner journeys, and repo-quality issues. For everything else, the existing remediation field on the finding becomes the generic recipe.

프롬프트 예시

Fix the "Hero image is lazy-loaded and missing dimensions" finding on /pricing.

Issue: The largest above-the-fold image is marked loading="lazy" and has
no explicit width/height. That can delay LCP and create layout shift.

Codebase context: Next.js.

Recommended fix:
Use next/image or the existing image component with explicit width/height,
responsive sizes, meaningful alt text, and priority/fetchPriority for the
first major visual on the page.

Constraints:
- Don't break existing tests; run the test suite after the change.
- Match the codebase's existing style and lint config.
- Add a brief comment explaining the performance reasoning only where the
  fix would otherwise look arbitrary.
- If the fix needs a new dependency, install it via the project's
  package manager (npm / pnpm / pip / bundle / composer).

Reference: Core Web Vitals / Largest Contentful Paint guidance.

지원 framework

다음에 대해 framework-specific snippet을 제공합니다.

  • Next.js, React, Vue, Nuxt, Svelte(frontend)
  • Express, Fastify(Node.js backend)
  • Django, Flask(Python)
  • Ruby on Rails
  • Laravel(PHP)
  • ASP.NET Core(계획 중, 현재는 generic fallback)

Framework 감지는 best-effort입니다. __NEXT_DATA__ tag, __NUXT__, hash cookie(laravel_session), X-Powered-By header, 그리고 몇 가지 signal을 sniff합니다. Custom framework를 쓰는 경우 prompt는 generic recipe로 fallback하고, agent가 package.json에서 직접 파악합니다.

AI 에이전트에서 사용

MCP 서버를 연결했다면 같은 prompt가 slash command로 노출됩니다. Claude Desktop에서:

/fixweb-fix finding_id=550e8400-e29b-41d4-a716-446655440000

The renderer looks up the finding, detects the framework from the parent scan when available, renders the templated prompt, and injects it into your conversation as the user message. No round-trip to our Claude API; templates are pure and free.

클릭마다 Claude를 호출하지 않는 이유

출시 전에는 클릭할 때마다 Anthropic API를 호출해 코드베이스 context로 prompt를 다듬는 방안을 고려했습니다. 하지 않은 이유는 다음과 같습니다.

  • 사용자가 붙여넣는 agent는 이미 코드베이스 context를 가지고 있습니다. repo를 연 Cursor / Claude Desktop을 쓰고 있기 때문입니다.
  • check × framework별 template만으로도 클릭당 비용 없이 가치의 약 80%를 제공합니다.
  • 사용자가 원한다면 나중에 “내 코드베이스용으로 AI로 다듬기” opt-in이 API를 호출할 수 있습니다. 현재는 호출하지 않습니다.
AI improvement prompts — Docs · FixWeb