frontend-code-review

Review React/TypeScript/Vite frontend files for quality, performance, correctness, and security.

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

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill helps you identify quality, performance, and correctness problems in Langflow’s frontend code before they ship, reducing regressions and review churn.

Core Features & Use Cases

  • Targeted frontend reviews: Review specific .tsx, .ts, and .js files, especially under src/frontend/.
  • Pending-change review mode: Validate staged/working-tree changes against a defined checklist before commit.
  • Actionable remediation: Produces urgent issues and improvement suggestions with file/line pointers and recommended fixes, aligned with Langflow frontend conventions.

Quick Start

Ask the skill to review the frontend file(s) you changed under src/frontend/ and report any urgent checklist violations with suggested fixes.

Frequently Asked Questions about frontend-code-review

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

FAQPage Schema
How do I review React and TypeScript files for frontend code quality issues?

Frontend code review for React and TypeScript checks quality, performance, correctness, and security/a11y rules. It analyzes .tsx, .ts, and .js files against established conventions, producing structured urgent fixes and improvement suggestions with specific file and line pointers.

Can I validate pending frontend changes before committing staged .tsx or .ts files?

Yes, you can validate pending frontend changes before committing. A pending-change review mode checks staged or working-tree .tsx and .ts files against a defined checklist for code-quality, performance, and business-logic patterns to catch regressions before shipping.

What is the best way to catch accessibility and security issues in React components?

The best way to catch accessibility and security issues in React components is through checklist-driven frontend code review. It evaluates .tsx files against established security and a11y rule catalogs, generating actionable remediation suggestions with specific file and line pointers.

Does this code review workflow target files outside the src/frontend/ directory?

No, this code review workflow specifically targets .tsx, .ts, and .js files within the src/frontend/ directory. It enforces checklist-driven analysis using rule catalogs tailored for this specific frontend project structure.

How do I get actionable remediation suggestions for TypeScript performance issues?

To get actionable remediation suggestions for TypeScript performance issues, run a targeted frontend code review. It checks .ts files against performance rule catalogs and outputs structured improvement suggestions with recommended fixes and precise file/line pointers.