frontend-review

Automate React and TypeScript frontend code reviews with classified findings and structured reports.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/JoaoPedroAmaral/backBarbearia --skill frontend-review-joaopedroamaral
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-review
Source: https://github.com/JoaoPedroAmaral/backBarbearia/tree/main/.claude/skills/frontend-review
Command: npx skills add https://github.com/JoaoPedroAmaral/backBarbearia --skill frontend-review-joaopedroamaral

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides a consistent, actionable system to review frontend code (React, TypeScript, CSS) so teams can quickly find, classify and prioritize issues that affect correctness, security, accessibility and performance before merging.

Core Features & Use Cases

  • Severity taxonomy: Blocking (CRITICAL, MAJOR, MINOR) and non-blocking (SUGGESTION, NIT, QUESTION) classifications to drive merge decisions.
  • Focused review areas: Correctness, Security, Performance, React patterns, Code quality, Testing, Accessibility and Anti-pattern detection.
  • Decision rules & reporting: Verdict table, file-prioritization, grouped findings by file, and a structured report template for MR summaries.
  • Agent prompts: Prewritten prompts for specialized reviewers (frontend-specialist, security-auditor, test-engineer) to produce consistent, role-focused findings.

Quick Start

Run a review on a pull request by classifying each finding with its severity, grouping issues by file, and generating the structured report sections (BLOCKING, SUGGESTION, NIT, QUESTION).

Frequently Asked Questions about frontend-review

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate React and TypeScript code reviews for pull requests?

Automate React and TypeScript code reviews by classifying findings with severity levels, grouping issues by file, and generating structured MR summary reports to drive merge decisions.

What is the best way to classify frontend code review findings by severity?

Classify frontend code review findings using a severity taxonomy that splits issues into blocking categories like CRITICAL, MAJOR, and MINOR, and non-blocking categories like SUGGESTION, NIT, and QUESTION.

How do I audit React components for accessibility and security issues?

Audit React components for accessibility and security by applying prewritten agent prompts for specialized reviewers, producing consistent, role-focused findings across correctness, security, and accessibility domains.

Can I use automated review rules for custom hooks and forms in TypeScript?

Yes, automated review rules apply to custom hooks and forms in TypeScript projects, evaluating correctness, React patterns, code quality, and anti-pattern detection across integrated and mock contexts.

How do I generate a structured report for frontend merge request summaries?

Generate a structured frontend review report by enforcing verdict table rules, prioritizing files, and populating template sections for BLOCKING, SUGGESTION, NIT, and QUESTION findings.

Does the frontend code review process check for performance and anti-patterns?

Yes, the frontend code review process checks for performance bottlenecks and anti-patterns alongside correctness, security, accessibility, React patterns, code quality, and testing to ensure comprehensive coverage.