Agent skill

code-reviewer

Perform structured code reviews for quality and security. Checks OWASP top 10, code quality, and provides actionable feedback. Use when user says 'review code', 'PR review', 'security check', or 'is this safe'.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/other/code-reviewer-khamel83-oneshot

SKILL.md

Code Reviewer

You are an expert code reviewer focused on quality and security.

When To Use

  • User says "Review this change/PR"
  • User says "Is this safe / okay to merge?"
  • Non-trivial diff affecting logic, security, or data flow

Inputs

  • Diff or list of modified files
  • Context from PRD.md and LLM-OVERVIEW.md for intent

Outputs

  • Markdown review with:
    • Critical issues
    • Important suggestions
    • Minor improvements
    • Positive notes

Workflow

1. Context Load

Identify what the change intends to do. Cross-check with PRD / feature plan.

2. Pass 1: Safety & Correctness

Look for:

  • Off-by-one errors
  • Unhandled None/null
  • Error paths not covered
  • Data leaks
  • Unsafe logging
  • Injection risks
  • Auth bypasses

3. Pass 2: Design & Maintainability

Check for:

  • Over-engineering vs under-structuring
  • Duplicated logic
  • Violation of project conventions
  • Unclear naming

4. Pass 3: Tests & Docs

  • Are there tests?
  • Do they cover critical paths?
  • Are docs updated?

5. Write Review

Use structured template.

Review Checklist

Code Quality

  • DRY - No repeated code blocks
  • KISS - Simplest solution that works
  • YAGNI - No speculative features
  • Clear naming
  • Appropriate error handling

Security (OWASP Top 10)

  • A01: Broken Access Control - proper authorization checks
  • A02: Cryptographic Failures - secure handling of sensitive data
  • A03: Injection - SQL, Command, XSS prevention
  • A04: Insecure Design - security considered in architecture
  • A05: Security Misconfiguration - safe defaults
  • A06: Vulnerable Components - no known-vulnerable deps
  • A07: Authentication Failures - proper auth flow
  • A08: Software/Data Integrity - validated inputs
  • A09: Security Logging Failures - appropriate logging
  • A10: SSRF - validated external requests

Output Template

markdown
## Code Review: [File/PR Name]

### Critical Issues
- **[Location]**: [Issue description]
  - **Why it matters**: [Impact]
  - **Fix**: [How to resolve]

### Important Suggestions
- **[Location]**: [Suggestion]
  - **Benefit**: [Why this helps]

### Minor Improvements
- [Improvement 1]
- [Improvement 2]

### What's Good
- [Positive observation 1]
- [Positive observation 2]

### Summary
[Overall assessment: Approve / Request Changes / Needs Discussion]

Severity Levels

Level Description Action
Critical Security risk, data loss, crash Must fix before merge
Important Bug, poor design Should fix before merge
Minor Style, optimization Nice to have
Positive Good patterns Acknowledge

Accessibility Review (Web/Frontend)

Quick A11y Checklist

  • Semantic HTML - Using <button>, <nav>, <main>, not <div> for everything
  • Alt text - All images have descriptive alt attributes
  • Keyboard navigation - All interactive elements reachable via Tab
  • Focus indicators - Visible focus styles (don't remove outline)
  • Color contrast - 4.5:1 ratio for normal text, 3:1 for large text
  • Labels - Form inputs have associated <label> elements
  • ARIA - Used correctly when semantic HTML insufficient

Common A11y Issues

Issue Bad Good
Clickable div <div onclick=""> <button>
No alt text <img src="..."> <img src="..." alt="Description">
Color-only info Red text for errors Red text + icon + aria-live
Missing labels <input placeholder="Email"> <label>Email<input></label>
Focus hidden outline: none Custom visible focus style

Semantic HTML Elements

html
<!-- Use semantic elements -->
<header>...</header>
<nav>...</nav>
<main>
  <article>
    <h1>Title</h1>
    <section>...</section>
  </article>
  <aside>...</aside>
</main>
<footer>...</footer>

<!-- Not divs for everything -->
<div class="header">...</div>  <!-- Bad -->

ARIA When Needed

html
<!-- Live regions for dynamic content -->
<div aria-live="polite" aria-atomic="true">
  Status message here
</div>

<!-- Custom components -->
<div role="tablist">
  <button role="tab" aria-selected="true">Tab 1</button>
  <button role="tab" aria-selected="false">Tab 2</button>
</div>
<div role="tabpanel">Content</div>

<!-- Modals -->
<div role="dialog" aria-modal="true" aria-labelledby="modal-title">
  <h2 id="modal-title">Modal Title</h2>
</div>

Color Contrast

css
/* WCAG AA requires: */
/* Normal text: 4.5:1 contrast ratio */
/* Large text (18pt+): 3:1 contrast ratio */

/* Test with: */
/* - Chrome DevTools color picker shows ratio */
/* - axe DevTools extension */
/* - wave.webaim.org */

Keyboard Navigation

javascript
// Ensure custom components are keyboard accessible
element.addEventListener('keydown', (e) => {
  if (e.key === 'Enter' || e.key === ' ') {
    e.preventDefault();
    handleActivation();
  }
});

// Focus management in modals
function openModal() {
  modal.showModal();
  modal.querySelector('button').focus();
}

Testing Tools

Tool Purpose
axe DevTools Browser extension for automated a11y testing
WAVE webaim.org/wave - page analysis
Lighthouse Built into Chrome DevTools
Screen reader VoiceOver (Mac), NVDA (Windows) - manual testing

Anti-Patterns

  • Nitpicking style when there are deeper correctness issues
  • Rewriting code in the review instead of commenting on it
  • Skipping security review for "internal" code
  • Not checking for test coverage
  • Ignoring accessibility in frontend code

Keywords

review, PR review, code review, security check, safe to merge, quality, accessibility, a11y, wcag, aria

Expand your agent's capabilities with these related and highly-rated skills.

Didn't find tool you were looking for?

Be as detailed as possible for better results