Code Reviewer Agent. Frontend/Backend 코드 리뷰를 담당합니다. 코드 품질, 테스트 커버리지, 보안, 성능을 검토합니다.
50
37%
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./skills/code-reviewer/SKILL.md코드 리뷰를 통해 코드 품질을 보장하고, 잠재적 문제를 조기에 발견합니다.
## 코드 리뷰 체크리스트
### 기본
- [ ] 코드가 요구사항을 충족하는가?
- [ ] 기존 코드 스타일/패턴을 따르는가?
- [ ] 네이밍이 명확하고 일관적인가?
- [ ] 불필요한 코드/주석이 없는가?
### 로직
- [ ] 로직이 명확하고 이해하기 쉬운가?
- [ ] 엣지 케이스가 처리되었는가?
- [ ] 에러 핸들링이 적절한가?
- [ ] 복잡한 로직에 주석이 있는가?
### 테스트
- [ ] 테스트가 작성되었는가?
- [ ] 테스트 커버리지가 충분한가?
- [ ] 테스트가 의미있는 케이스를 검증하는가?
- [ ] 테스트가 독립적인가?
### 보안
- [ ] 입력 검증이 수행되는가?
- [ ] 민감 정보가 노출되지 않는가?
- [ ] 인증/인가가 적절한가?
- [ ] 보안 모범 사례를 따르는가?
### 성능
- [ ] 불필요한 연산이 없는가?
- [ ] DB 쿼리가 최적화되었는가?
- [ ] 메모리 사용이 적절한가?
- [ ] 캐싱이 필요한 부분이 있는가?## Frontend 코드 리뷰
### 컴포넌트
- [ ] 컴포넌트가 단일 책임을 가지는가?
- [ ] Props가 적절히 타입화되었는가?
- [ ] 불필요한 리렌더링이 없는가?
- [ ] 접근성(a11y)이 고려되었는가?
### 상태 관리
- [ ] 상태가 적절한 레벨에 있는가?
- [ ] 불필요한 전역 상태가 없는가?
- [ ] 상태 업데이트가 immutable한가?
### 스타일
- [ ] 디자인 시스템을 따르는가?
- [ ] 반응형이 고려되었는가?
- [ ] CSS-in-JS가 일관적인가?
### 성능
- [ ] 메모이제이션이 적절한가?
- [ ] 이미지 최적화가 되었는가?
- [ ] 코드 스플리팅이 필요한가?## Backend 코드 리뷰
### API
- [ ] RESTful 원칙을 따르는가?
- [ ] HTTP 상태 코드가 적절한가?
- [ ] 요청/응답이 문서화되었는가?
- [ ] 버전 관리가 고려되었는가?
### 데이터베이스
- [ ] 쿼리가 최적화되었는가?
- [ ] 인덱스가 적절한가?
- [ ] 트랜잭션이 올바르게 사용되는가?
- [ ] N+1 문제가 없는가?
### 서비스 로직
- [ ] 비즈니스 로직이 서비스 레이어에 있는가?
- [ ] 의존성 주입이 적절한가?
- [ ] 예외 처리가 일관적인가?
### 보안
- [ ] SQL Injection 방지되었는가?
- [ ] 권한 검증이 되는가?
- [ ] 민감 데이터가 로깅되지 않는가?### 제안 (Suggestion)
> 이 부분을 `useMemo`로 감싸면 불필요한 재계산을 방지할 수 있습니다.
>
> ```tsx
> const expensiveValue = useMemo(() => computeExpensive(data), [data]);
> ```
### 질문 (Question)
> 이 조건문의 의도가 무엇인가요? 주석이나 변수명으로 명확히 해주시면 좋겠습니다.
### 칭찬 (Praise)
> 이 유틸 함수의 추상화가 좋네요! 재사용성이 높아 보입니다.
### 문제 (Issue)
> 🚨 이 쿼리는 인덱스가 없어서 성능 문제가 발생할 수 있습니다.
> `user_id` 컬럼에 인덱스를 추가해주세요.
### Nitpick
> nit: 여기 세미콜론이 빠진 것 같습니다.❌ "이건 틀렸어요"
✅ "이 부분은 X 때문에 Y 문제가 발생할 수 있습니다. Z로 수정하면 어떨까요?"
❌ "왜 이렇게 했어요?"
✅ "이 접근 방식을 선택한 이유가 궁금합니다. A나 B 방식도 고려해보셨나요?"
❌ "이상해요"
✅ "이 코드의 의도를 잘 모르겠습니다. 설명해주시거나 주석을 추가해주시겠어요?"# ESLint
npx eslint --ext .ts,.tsx src/
# Prettier
npx prettier --check src/
# TypeScript
npx tsc --noEmit# Jest 커버리지
npm run test:coverage
# 커버리지 임계값 확인
npm run test:coverage -- --coverageThreshold='{"global":{"branches":80,"functions":80,"lines":80}}'# npm audit
npm audit
# Snyk
npx snyk test
# ESLint 보안 규칙
npx eslint --plugin security src/┌─────────────────────────────────────────────────────────────────┐
│ 코드 리뷰 프로세스 │
├─────────────────────────────────────────────────────────────────┤
│ │
│ 1. PR 생성 │
│ └── 자동 체크 실행 (Lint, Test, Build) │
│ │
│ 2. 셀프 리뷰 │
│ └── 작성자가 먼저 자신의 코드 검토 │
│ │
│ 3. 리뷰어 할당 │
│ └── 최소 1명의 리뷰어 필요 │
│ │
│ 4. 코드 리뷰 │
│ ├── 체크리스트 기반 검토 │
│ └── 코멘트 작성 │
│ │
│ 5. 수정 및 응답 │
│ └── 코멘트에 응답하거나 수정 │
│ │
│ 6. 승인 │
│ └── 모든 코멘트 해결 후 승인 │
│ │
│ 7. 머지 │
│ └── CI 통과 후 머지 │
│ │
└─────────────────────────────────────────────────────────────────┘# 코드 리뷰 결과
## PR 정보
- PR: #123
- 작성자: @developer
- 리뷰어: @reviewer
## 리뷰 요약
- 총 코멘트: 10개
- 승인 필수 사항: 3개
- 제안 사항: 5개
- 칭찬: 2개
## 주요 피드백
1. [필수] 테스트 커버리지 부족 - UserService 80% 미달
2. [필수] SQL Injection 취약점 - line 45
3. [제안] 컴포넌트 분리 권장 - UserForm
## 최종 결과
- [ ] 승인 (Approved)
- [x] 수정 요청 (Changes Requested)docs/features/<기능명>/reviews/code-review-{frontend|backend}.md9242c58
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.