원클릭으로 Manus에서 모든 스킬 실행

quality-check

스타2

포크1

업데이트2026년 5월 2일 07:47

Reviews code changes against accessibility, responsiveness, performance, and security standards. Triggers on PR review or after non-trivial changes to app/, components/, or lib/.

설치

Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.

Manus에서 실행

출처

hsnice16

hsnice16/agent-friendly-code

GitHub 저장소 열기 Creator 저장소 보기

다운로드

Manus에서 실행

Quality check — a11y, responsive, performant, secure

Run the four checks below on any diff affecting UI or I/O. Report findings grouped by dimension.

Accessibility

Landmarks: one <main>, one <h1> per page, <nav aria-label> on every nav.
Semantic HTML: <button> for buttons, <a> for links, <form> for forms. No <div onClick>.
aria-label on every icon-only interactive element (hamburger button, external-link icon, medal chips, score bars).
Keyboard reachability: every interactive element is focusable and visibly shows focus. The global *:focus-visible ring covers most cases; verify for custom controls.
Color contrast AA: text-muted on bg-surface and bg-surface-2 must hit 4.5:1 for body text (3:1 for large). Run the numbers if you change color tokens.
Reduced motion: transitions/animations respect @media (prefers-reduced-motion: reduce).
Form labels: every input has an associated <label> (visible or sr-only).

Responsive

Viewport sizes to verify: 320 px, 640 px (sm), 768 px (md), 1080 px+ (container max).
Nav: collapses to <MobileNav> hamburger below md.
Tables: wrapped in overflow-x-auto — never force horizontal page scroll.
Hero / headings: scale with sm: or md: prefix.
Grids: fall back to grid-cols-1 on narrow.
Flex rows that hold long content: flex-col sm:flex-row to stack on mobile.
Hero paragraph and body text: max ~70ch to keep line length readable.

Performance

Server components by default. Client components only when necessary.
Third-party scripts loaded via next/script with strategy="afterInteractive" — see GoogleAnalytics.tsx.
No client-side data fetching for rendering — use the DB in a Server Component or API route.
Image optimisation via <Image> when we add images; no <img> unless the src is dynamic and unknown at build.
Bundle weight: flag any new dep > 50 KB gzipped. Justify or use a smaller alternative.
Database queries are prepared once and reused where hot.

Security

SQL parameterisation: every query uses ? placeholders. No string concatenation.
dangerouslySetInnerHTML is allowed only for server-built JSON-LD (app/layout.tsx, app/page.tsx, app/action/page.tsx, app/skill/page.tsx, app/methodology/page.tsx, app/repo/[id]/page.tsx, app/package/[registry]/[name]/page.tsx) and must keep the < → < escape. Any other use must be rejected.
External URLs in <a target="_blank"> always include rel="noopener noreferrer".
User input at every boundary is validated: parseRepoUrl for repo URLs, Number.isFinite for numeric params, length caps on search strings.
Clone safety: git clone --depth 1 --single-branch; never execute code from a clone (no bun install, no npm install, no post-clone scripts).
Secrets never in code. .env.example documents required vars; .env.local is gitignored.
Operational concerns (flag for ops review, not code):
- Disk cap on the clone workspace.
- Rate limit on the public API before launch.
- Sandbox the cloner in a container for production.

Response format

For each dimension, list:

Pass items (short, one line each).
Fail items with file:line + the fix.
Needs manual check items (e.g. "contrast pass requires a visual check at these two color pairings").

If everything passes, say so plainly. Don't invent issues to look thorough.

이 저장소의 다른 Skills

같은 저장소

agent-friendly

hsnice16/agent-friendly-code

Score the current repo's agent-friendliness on disk and recommend a model class to use for it. Use when the user asks "is this repo a mess?", "which model should I use here?", "is my repo agent-ready?", or invokes /agent-friendly.

2026-05-022

code-review

hsnice16/agent-friendly-code

Reviews code changes for repo-specific best practices — Tailwind usage, constants/utils extraction, I/O boundary, React Server Components, and component reuse. Triggers during PR review or after non-trivial edits to app/, components/, or lib/.

2026-05-022

post-change-check

hsnice16/agent-friendly-code

Orchestrates the end-of-turn review after non-trivial edits to app/, components/, lib/, scripts/, or config files. Runs the docs-sync audit, invokes the code-review and quality-check skills on the diff, and flags anything still missing before the turn can close.

2026-04-252

Quality check — a11y, responsive, performant, secure

Run the four checks below on any diff affecting UI or I/O. Report findings grouped by dimension.

Accessibility

Landmarks: one <main>, one <h1> per page, <nav aria-label> on every nav.

Semantic HTML: <button> for buttons, <a> for links, <form> for forms. No <div onClick>.

aria-label on every icon-only interactive element (hamburger button, external-link icon, medal chips, score bars).

Keyboard reachability: every interactive element is focusable and visibly shows focus. The global *:focus-visible ring covers most cases; verify for custom controls.

Color contrast AA: text-muted on bg-surface and bg-surface-2 must hit 4.5:1 for body text (3:1 for large). Run the numbers if you change color tokens.

Reduced motion: transitions/animations respect @media (prefers-reduced-motion: reduce).

Form labels: every input has an associated <label> (visible or sr-only).

Responsive

Viewport sizes to verify: 320 px, 640 px (sm), 768 px (md), 1080 px+ (container max).

Nav: collapses to <MobileNav> hamburger below md.

Tables: wrapped in overflow-x-auto — never force horizontal page scroll.

Hero / headings: scale with sm: or md: prefix.

Grids: fall back to grid-cols-1 on narrow.

Flex rows that hold long content: flex-col sm:flex-row to stack on mobile.

Hero paragraph and body text: max ~70ch to keep line length readable.

Performance

Server components by default. Client components only when necessary.

Third-party scripts loaded via next/script with strategy="afterInteractive" — see GoogleAnalytics.tsx.

No client-side data fetching for rendering — use the DB in a Server Component or API route.

Image optimisation via <Image> when we add images; no <img> unless the src is dynamic and unknown at build.

Bundle weight: flag any new dep > 50 KB gzipped. Justify or use a smaller alternative.

Database queries are prepared once and reused where hot.

Security

SQL parameterisation: every query uses ? placeholders. No string concatenation.

dangerouslySetInnerHTML is allowed only for server-built JSON-LD (app/layout.tsx, app/page.tsx, app/action/page.tsx, app/skill/page.tsx, app/methodology/page.tsx, app/repo/[id]/page.tsx, app/package/[registry]/[name]/page.tsx) and must keep the < → < escape. Any other use must be rejected.

External URLs in <a target="_blank"> always include rel="noopener noreferrer".

User input at every boundary is validated: parseRepoUrl for repo URLs, Number.isFinite for numeric params, length caps on search strings.

Clone safety: git clone --depth 1 --single-branch; never execute code from a clone (no bun install, no npm install, no post-clone scripts).

Secrets never in code. .env.example documents required vars; .env.local is gitignored.

Operational concerns (flag for ops review, not code):

Disk cap on the clone workspace.
Rate limit on the public API before launch.
Sandbox the cloner in a container for production.

Response format

For each dimension, list:

Pass items (short, one line each).

Fail items with file:line + the fix.

Needs manual check items (e.g. "contrast pass requires a visual check at these two color pairings").

If everything passes, say so plainly. Don't invent issues to look thorough.

name	quality-check
description	Reviews code changes against accessibility, responsiveness, performance, and security standards. Triggers on PR review or after non-trivial changes to app/, components/, or lib/.