도구가 필요합니다, 많은 도구가 필요합니다

발행: (2025년 12월 12일 오전 08:36 GMT+9)
4 min read
원문: Dev.to

Source: Dev.to

‘You need tools, lots of tools’ 표지 이미지

특화된 QA 에이전트

최근에 맞춤형 채팅 에이전트 구성을 시도했습니다. 이 예시는 기본 웹 프로젝트에 적용됩니다:

You are a Quality Assessor, an expert in web standards, HTML semantics, CSS best practices, responsive design, and accessibility.
Your specialty is evaluating static sites for quality, consistency, and adherence to modern web standards.

# Your Mission
Assess the quality of the Website site by validating:
1. **HTML Semantics** - Proper use of semantic elements, valid structure
2. **CSS Quality** - Rule consistency, layout patterns, responsive design
3. **Accessibility** - ARIA labels, keyboard navigation, contrast, alt text
4. **Bilingual Consistency** - English and French versions have equivalent quality

프로젝트의 도구 체인(린터, e2e 테스트, 맞춤 Bash 스크립트 등)에 연결했으며, 이를 통해 기본 QA를 자동화합니다. 이러한 에이전트는 클라이언트나 채팅에서 사용할 수 있습니다:

@quality-accessor Assess the English homepage at http://local.url
Validate HTML semantics, CSS rules, accessibility, and responsive layout.

기존 MCP 및 도구 재사용

프로젝트에서 이미 사용하고 있던 Playwright 에이전트 위에 추가했습니다:

chatagent
---
name: quality-accessor
description: 'Quality assurance agent for static websites. Validates HTML semantics, CSS, accessibility, and bilingual consistency. Use: @quality-accessor Assess http://local.url/ [html|css|layout|accessibility|all]'

tools: [search, playwright-test/*]
model: Claude Sonnet 4

Playwright 도구를 통한 매우 기본적인 자동화이지만, 브레이크포인트에서 반응형 테스트를 위한 실제 브라우저 상호작용을 가능하게 합니다.

단계별 설명

Claude에게 각 단계를 자세히 작성하도록 요청했습니다. 에이전트는 최종적으로 긍정적인 발견과 모범 사례를 나열한 품질 보고서를 생성하고, 문제를 심각도별로 분류해야 합니다:

---
#### ✅ Strengths
- List positive findings
- Highlight best practices followed
- Note excellent implementations

#### ⚠️ Issues Found
Categorize by severity:

**🔴 Critical Issues**
- Accessibility blockers
- Invalid HTML structure
- Broken functionality
- CSS lint errors

**🟡 Warnings**
- Minor accessibility issues
- CSS inconsistencies
- Missing best practices
- CSS lint warnings

**🔵 Suggestions**
- Potential improvements
- Optimization opportunities
- Enhanced patterns

컨텍스트 제공

맞춤형 에이전트는 프로젝트별 규칙과 워크플로에 맞게 조정됩니다. 자연어 프롬프트 대신 짧은 명령어를 정의하여 특정 테스트 시퀀스를 실행하고, 보고서를 생성하며, 수정 작업의 우선순위를 지정할 수 있습니다. 모든 문제를 잡아내지는 못하지만, 흥미로운 추가 검증 레이어를 제공하고 일반적으로 인터랙티브 테스트를 건너뛰는 일반 도구보다 더 엄격합니다.

마무리

일반 도구도 여전히 유용하지만, 모든 지표가 의미 있는 것은 아닙니다. 예를 들어, 특정 지표에 집착하면서도 다른 많은 품질 요구사항이 동일하게 중요할 수 있습니다.

Back to Blog

관련 글

더 보기 »