Agent skill · software engineering · aiskillstore
frontend-code-review
Review Dify frontend code for correctness, accessibility, component design, dify-ui usage, data/query boundaries, performance, and tests. Trigger for `.tsx`, `.ts`, `.js`, UI, React, Next.js, pending-change, or focused frontend review requests.
Why this skill is useful
Adds specific review criteria and guidelines for frontend code that the AI wouldn't reliably generate on its own.
What it needs
About 3k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.
What this skill does
Frontend Code Review When To Use Use this skill when the user asks to review, audit, analyze, or sanity-check frontend code under web/, packages/dify-ui/, or frontend-adjacent TypeScript files. Supported modes: Pending-change review: inspect staged and working-tree changes. File-focused review: inspect explicitly named files or paths. Diff/snippet review: review pasted diffs or snippets using best-effort references. Do not use this skill for backend-only code under api/; use backend-code-review instead. Required Context Before reviewing, read the relevant local contracts: web/AGENTS.md for Dify frontend workflow, overlays, design tokens, state, and tests. packages/dify-ui/README.md and packages/dify-ui/AGENTS.md when code uses or changes @langgenius/dify-ui/. web/docs/overlay.md when reviewing dialogs, drawers, popovers, tooltips, menus, selects, comboboxes, or other floating UI. web/docs/test.md and the frontend-testing skill when reviewing tests or testability. karpathy-guidelines for scope control and focused, verifiable changes. how-to-write-component when reviewing React component structure, ownership, effects, query/mutation contracts, or memoization. For any UI, UX, or accessibility review, fetch the latest Web Interface Guidelines before finalizing findings. Treat them as a required baseline, not the complete source of accessibility truth: If the review depends on a current framework, SDK, browser API, or accessibility behavior and local code does not settle it, check the current official docs first. For browser compatibility, deprecation, or behavior-sensitive frontend APIs, verify MDN or the relevant standard. Rule Packs Apply every relevant rule pack: references/accessibility-ui.md — accessibility, semantic HTML, focus, forms, keyboard, disabled states, copy, and long-content behavior. Combines Web Interface Guidelines with Dify UI, Base UI, MDN, and local primitive contracts. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills aiskillstore/frontend-code-review