Praca z narzędziem

Audit the project

Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, "what is wrong with this site", or before a release.

fe-auditkażdego projektu webowego5 regułładowane zawsze: 83 tokeny; przy użyciu: 778 tokenów; w referencjach na żądanie: 731 tokenów.

Instalacja

init instaluje ten skill, gdy projekt używa: każdego projektu webowego. Wybierz agenta, aby zobaczyć, gdzie trafią jego pliki.

Agent
npx github:dawidolko/frontend-skills init

Bez --agents polecenie init rozpoznaje agentów po tym, co projekt już ma, a gdy nie znajdzie żadnego, pyta:

Po czym init rozpoznaje każdego z agentów (17)
AgentRozpoznawany po
Claude CodeCLAUDE.md .claude CLAUDE.local.md
OpenAI Codex.codex AGENTS.override.md
Cursor.cursor .cursorrules
GitHub Copilot.github/copilot-instructions.md .github/instructions .github/skills .github/prompts
Gemini CLIGEMINI.md .gemini
Antigravity CLI.agents/rules .agent/rules
Devin / Windsurf.devin .windsurf .windsurfrules
OpenCodeopencode.json opencode.jsonc .opencode
Cline.clinerules .cline
Zed.rules .zed
JetBrains Junie.junie
Kiro.kiro
Augment.augment .augment-guidelines
Trae.trae
Continue.continue
Amazon Q Developer.amazonq
Aider.aider.conf.yml CONVENTIONS.md

Gdzie trafia fe-audit dla: Claude Code

  • .claude/skills/fe-audit/SKILL.mdskill
  • .claude/skills/fe-audit/references/report.mdskill
  • .claude/rules/fe-audit.mdplik reguł
  • CLAUDE.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.claude/rules/fe-audit.md
---
paths:
  - "**/frontend-report.md"
  - "**/.frontend-skills/**"
---

# Audit the project (frontend-skills)

Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, "what is wrong with this site", or before a release.

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.claude/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: OpenAI Codex

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

OpenAI Codex nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.
Prawdziwy plik

Gdzie trafia fe-audit dla: Cursor

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • .cursor/rules/fe-audit.mdcplik reguł
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.cursor/rules/fe-audit.mdc
---
description: Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, "what is wrong with this site", or before a release.
globs: **/frontend-report.md, **/.frontend-skills/**
alwaysApply: false
---

# Audit the project (frontend-skills)

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.agents/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: GitHub Copilot

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • .github/instructions/fe-audit.instructions.mdplik reguł
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.github/instructions/fe-audit.instructions.md
---
applyTo: "**/frontend-report.md,**/.frontend-skills/**"
description: "Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, \"what is wrong with this site\", or before a release."
---

# Audit the project (frontend-skills)

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.agents/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: Gemini CLI

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • GEMINI.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Gemini CLI: Gemini CLI was replaced by Antigravity CLI for unpaid tiers on 2026-06-18; choose "antigravity" too if you use it.

Gemini CLI nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

GEMINI.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.
Prawdziwy plik

Gdzie trafia fe-audit dla: Antigravity CLI

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • .agents/rules/fe-audit.mdplik reguł
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.agents/rules/fe-audit.md
---
trigger: glob
globs: "**/frontend-report.md, **/.frontend-skills/**"
description: "Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, \"what is wrong with this site\", or before a release."
---

# Audit the project (frontend-skills)

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.agents/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: Devin / Windsurf

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • .devin/rules/fe-audit.mdplik reguł
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Devin / Windsurf: Devin CLI also reads .cursor/rules; with Cursor chosen too, the CLI sees both rule files of a skill.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.devin/rules/fe-audit.md
---
trigger: glob
globs: "**/frontend-report.md,**/.frontend-skills/**"
---

# Audit the project (frontend-skills)

Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, "what is wrong with this site", or before a release.

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.agents/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: OpenCode

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

OpenCode nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.
Prawdziwy plik

Gdzie trafia fe-audit dla: Cline

  • .claude/skills/fe-audit/SKILL.mdskill
  • .claude/skills/fe-audit/references/report.mdskill
  • .clinerules/fe-audit.mdplik reguł
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Cline: If .clinerules is a single file rather than a folder, Cline rule files are not written; skills still are.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.clinerules/fe-audit.md
---
paths:
  - "**/frontend-report.md"
  - "**/.frontend-skills/**"
---

# Audit the project (frontend-skills)

Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, "what is wrong with this site", or before a release.

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.claude/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: Zed

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • CLAUDE.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zed: Zed reads only the first instruction file of its list; the block is placed in that file.

Zed nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

CLAUDE.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.
Prawdziwy plik

Gdzie trafia fe-audit dla: JetBrains Junie

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

JetBrains Junie: Junie reads .agents/skills only in a trusted project.

JetBrains Junie nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.
Prawdziwy plik

Gdzie trafia fe-audit dla: Kiro

  • .kiro/skills/fe-audit/SKILL.mdskill
  • .kiro/skills/fe-audit/references/report.mdskill
  • .kiro/steering/fe-audit.mdplik reguł
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.kiro/steering/fe-audit.md
---
inclusion: fileMatch
fileMatchPattern: ["**/frontend-report.md", "**/.frontend-skills/**"]
---

# Audit the project (frontend-skills)

Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, "what is wrong with this site", or before a release.

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.kiro/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: Augment

  • .agents/skills/fe-audit/SKILL.mdskill
  • .agents/skills/fe-audit/references/report.mdskill
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Augment nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.
Prawdziwy plik

Gdzie trafia fe-audit dla: Trae

  • .trae/skills/fe-audit/SKILL.mdskill
  • .trae/skills/fe-audit/references/report.mdskill
  • .trae/rules/fe-audit.mdplik reguł
  • AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Trae: Trae reads AGENTS.md only after it is enabled in its settings.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.trae/rules/fe-audit.md
---
description: "Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, \"what is wrong with this site\", or before a release."
globs: **/frontend-report.md,**/.frontend-skills/**
alwaysApply: false
---

# Audit the project (frontend-skills)

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.trae/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: Continue

  • .frontend-skills/skills/fe-audit/SKILL.mdskill
  • .frontend-skills/skills/fe-audit/references/report.mdskill
  • .continue/rules/fe-audit.mdplik reguł

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.continue/rules/fe-audit.md
---
name: "Audit the project"
description: "Audits a front-end project with frontend-skills - runs the static audit (and the page audit with --url when a page is running), reads the condensed JSON, explains the top findings by rule id with their source, lists what needs a person, and proposes an order of fixes. Use when asked to audit, check or score a project or page, \"what is wrong with this site\", or before a release."
globs: ["**/frontend-report.md", "**/.frontend-skills/**"]
alwaysApply: false
---

# Audit the project (frontend-skills)

- Run the audit, do not imitate it: `npx github:dawidolko/frontend-skills audit --json` and read the JSON, not the source by eye.
- Run the page audit only on a page the person started, with their yes: `audit --url <address>`.
- Present findings by rule id, severity first: critical, serious, moderate, minor.
- For each top rule say why it matters, the fix and how many places; `explain <id>` gives the text and the source.
- Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
- Group fixes by file and by shared component, so one change clears many findings.
- List what the audit cannot check (browser rules without `--url`, manual rules) as a checklist for a person.
- Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
- Never change files during an audit; propose the fixes and let `fe-fix` apply them.

Before larger changes, read the full skill: `.frontend-skills/skills/fe-audit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.
Prawdziwy plik

Gdzie trafia fe-audit dla: Amazon Q Developer

  • .frontend-skills/skills/fe-audit/SKILL.mdskill
  • .frontend-skills/skills/fe-audit/references/report.mdskill
  • .amazonq/rules/frontend-skills.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Amazon Q Developer: Amazon Q Developer IDE plugins reach end of support on 2027-04-30; AWS points to Kiro.

Amazon Q Developer nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.amazonq/rules/frontend-skills.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

### Skills

- `fe-audit` (Audit the project): when editing `**/frontend-report.md`, `**/.frontend-skills/**`, first read `.frontend-skills/skills/fe-audit/SKILL.md`.
Prawdziwy plik

Gdzie trafia fe-audit dla: Aider

  • .frontend-skills/skills/fe-audit/SKILL.mdskill
  • .frontend-skills/skills/fe-audit/references/report.mdskill
  • CONVENTIONS.mdblok instrukcji
  • .aider.conf.ymlkonfiguracja

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Aider nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

CONVENTIONS.md
## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

### Skills

- `fe-audit` (Audit the project): when editing `**/frontend-report.md`, `**/.frontend-skills/**`, first read `.frontend-skills/skills/fe-audit/SKILL.md`.
Prawdziwy plik

Jak go używać

Po instalacji agent sam ładuje skill, gdy zadanie pasuje do jego opisu. Możesz też poprosić o niego własnymi słowami, na przykład:

Frazy z opisu skilla, po których agent go wybiera (po angielsku, jak w skillu):

  • what is wrong with this site

A żeby sprawdzić i poprawić pracę:

  • Użyj skilla fe-audit na tym pliku.
  • Uruchom audyt front-endu na moich zmianach i popraw wszystko, co poważne.
  • Wyjaśnij a11y/control-name i popraw to tutaj.

Reguły, których uczy

  • a11y/control-name

    Every button and link has an accessible name; icon-only controls get visually hidden text or aria-label.

    krytycznastatyczneWCAG 4.1.2, 2.4.4

  • a11y/input-label

    Every form field has a programmatic label (label element, aria-label or aria-labelledby); a placeholder is not a label.

    krytycznastatyczneWCAG 1.3.1, 3.3.2, 4.1.2

  • a11y/img-alt

    Every img and area element has an alt attribute; a decorative image has alt="".

    krytycznastatyczneWCAG 1.1.1

  • a11y/color-contrast

    Text has a contrast ratio of at least 4.5:1 with its background; large text (24px, or 18.5px bold) at least 3:1.

    poważnaw przeglądarceWCAG 1.4.3

  • perf/lcp-image

    The LCP image is in the initial HTML, not lazy, and has fetchpriority="high"; a CSS background LCP image is preloaded.

    umiarkowanaw przeglądarce

Skrót reguł

Ta część jest kopiowana do zawężonego pliku reguł każdego agenta, więc musi być zrozumiała sama w sobie:

  • Run the audit, do not imitate it: npx github:dawidolko/frontend-skills audit --json and read the JSON, not the source by eye.
  • Run the page audit only on a page the person started, with their yes: audit --url <address>.
  • Present findings by rule id, severity first: critical, serious, moderate, minor.
  • For each top rule say why it matters, the fix and how many places; explain <id> gives the text and the source.
  • Blocking problems first: missing names and labels (a11y/control-name, a11y/input-label, a11y/img-alt) before contrast (a11y/color-contrast) and speed (perf/lcp-image).
  • Group fixes by file and by shared component, so one change clears many findings.
  • List what the audit cannot check (browser rules without --url, manual rules) as a checklist for a person.
  • Never claim the project is accessible, compliant, secure or fast; say "N problems found, M items need a person".
  • Never change files during an audit; propose the fixes and let fe-fix apply them.

Kroki, które wykonuje agent

  1. npx github:dawidolko/frontend-skills audit --json (add --changed for only the changed files). Exit code 1 means something is at or above failOn; 2 is a usage error; 3 means a requested tool is missing.
  2. Read counts, then each entry of rules: severity s, fix, locations at (file:line).
  3. If a dev or preview server is running and the person agrees: audit --url http://localhost:5173/ --json for contrast, rendered names, Lighthouse scores and lab metrics.
  4. Write a short summary: counts by severity, the five rules that matter most with their fix and count, the shared components to fix first, the manual checklist.
  5. Point to frontend-report.md for the full list with sources, and to explain <id> for any rule.

Jak agent sprawdza swoją pracę

  • The summary names rule ids that exist (frontend-skills list --rules), and every location is file:line from the JSON.
  • The person can rerun the same command and get the same counts.

Sprawdzane audytem

Testy statyczne tych reguł działają w audit; to prawdziwa sesja na przykładowym projekcie:

Nagranie terminala: audit wypisuje znaleziska według wagi z identyfikatorami reguł i miejscem plik:linia i kończy się błędem od progu serious.
audit: liczby według wagi, każda reguła z pierwszym miejscem, kod wyjścia.

Pliki referencyjne