dev.to

The Code Exorcist: an AI agent diagnoses bugs, a human banishes them (Sanity + Next.js)

코드 엑소시스트 — AI가 버그를 진단하고 사람이 퇴치합니다

Next.js와 Sanity로 만든 버그 분류 앱입니다. Groq 기반 AI가 오류 로그와 버그 코드를 함께 분석해 원인과 수정안을 제시하고, 사람은 Sanity Studio에서 승인하거나 재분석을 요청합니다. 상태와 결정 기록은 실시간으로 웹 화면에 반영됩니다.

AI 요약

Code Exorcist는 버그 보고를 받은 직후 AI가 첫 진단을 맡고, 사람이 검토하는 과정을 구현한 앱입니다. 사용자가 오류 로그와 실제 문제가 있는 코드 조각을 제출하면 Groq 기반 에이전트가 둘을 함께 분석해 버그 유형, 위협 수준, 근본 원인과 수정안을 작성합니다. 최종 승인과 거절은 Sanity Studio에서 사람이 결정합니다.

상태와 검토 흐름

콘텐츠 문서인 haunting과 별도 workflowState 문서를 참조로 연결합니다. 워크플로 상태는 uncontained에서 pending_human_review를 거쳐 banished로 바뀌며, 각 단계에는 행위자, 작업, 시각, 메모를 기록합니다. 사용자가 버그를 제출하면 Next.js API 경로가 이를 Sanity에 저장하고, 이어지는 경로가 오류 로그와 코드 조각을 함께 Groq에 전달합니다. 진단 결과는 문서에 저장되고 상태는 사람의 검토 대기로 이동합니다.

Sanity Studio에는 기본 게시 흐름 대신 사용자 지정 문서 액션 두 가지를 등록했습니다. BANISH는 수정안을 승인하고 사례를 닫습니다. Send Back for Re-analysis는 진단을 거절하고 상태를 미해결로 되돌리며, 거절 사유도 기록합니다. 에이전트와 사람 모두 상태 전환을 만들고, 이력에서 각 결정을 확인할 수 있습니다.

실시간 화면과 구현 경험

프런트엔드는 GROQ 쿼리에 client.listen()을 연결해 새 제출, AI 진단, 승인·거절 결과를 페이지 새로고침 없이 보여줍니다. 전체·진행 중·퇴치 완료 건수를 표시하는 통계와 사례별 이력 타임라인도 제공합니다. 기술 구성은 Next.js, React, TypeScript, Sanity Studio v3, Groq AI, Tailwind CSS이며 Vercel에 배포했습니다.

개발 과정에서는 Groq 모델 이름을 확인하지 않아 llama-3.3-70b-versatile과 llama-3.1-8b-instant 호출이 model_not_found로 실패했습니다. 실제 모델 목록을 확인한 뒤 openai/gpt-oss-20b로 바꿨습니다. .env.local 변경 뒤 개발 서버를 완전히 재시작하지 않아 401 오류가 났고, 중복 스키마 필드도 Studio 실행을 막았습니다. 배포 때는 Windows에서 놓친 대소문자 구분 오류가 Vercel의 Linux 빌드에서 드러났습니다. 작성자는 Claude를 자율 에이전트가 아니라 오류를 주고받으며 수정·재검증하는 실행 파트너로 사용했다고 설명합니다.

dev.to 반응

  • @garima_gupta_1ca176a8b800 — 정말 창의적인 프로젝트네요! 콘셉트와 구현이 모두 마음에 들었습니다.

원문: dev.to / 번역·요약: Trawling