Jakość

Front-end security

Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked "is this safe".

fe-securitykażdego projektu webowego9 regułładowane zawsze: 90 tokenów; przy użyciu: 971 tokenów; w referencjach na żądanie: 1450 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-security dla: Claude Code

  • .claude/skills/fe-security/SKILL.mdskill
  • .claude/skills/fe-security/references/security.mdskill
  • .claude/rules/fe-security.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-security.md
---
paths:
  - "**/*.html"
  - "**/*.jsx"
  - "**/*.tsx"
  - "**/*.js"
  - "**/*.vue"
  - "**/*.svelte"
  - "**/*.astro"
  - "**/*.component.html"
---

# Front-end security (frontend-skills)

Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked "is this safe".

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: OpenAI Codex

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.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-security dla: Cursor

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.mdskill
  • .cursor/rules/fe-security.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-security.mdc
---
description: Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked "is this safe".
globs: **/*.html, **/*.jsx, **/*.tsx, **/*.js, **/*.vue, **/*.svelte, **/*.astro, **/*.component.html
alwaysApply: false
---

# Front-end security (frontend-skills)

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: GitHub Copilot

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.mdskill
  • .github/instructions/fe-security.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-security.instructions.md
---
applyTo: "**/*.html,**/*.jsx,**/*.tsx,**/*.js,**/*.vue,**/*.svelte,**/*.astro,**/*.component.html"
description: "Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked \"is this safe\"."
---

# Front-end security (frontend-skills)

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: Gemini CLI

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.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-security dla: Antigravity CLI

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.mdskill
  • .agents/rules/fe-security.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-security.md
---
trigger: glob
globs: "**/*.html, **/*.jsx, **/*.tsx, **/*.js, **/*.vue, **/*.svelte, **/*.astro, **/*.component.html"
description: "Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked \"is this safe\"."
---

# Front-end security (frontend-skills)

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: Devin / Windsurf

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.mdskill
  • .devin/rules/fe-security.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-security.md
---
trigger: glob
globs: "**/*.html,**/*.jsx,**/*.tsx,**/*.js,**/*.vue,**/*.svelte,**/*.astro,**/*.component.html"
---

# Front-end security (frontend-skills)

Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked "is this safe".

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: OpenCode

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.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-security dla: Cline

  • .claude/skills/fe-security/SKILL.mdskill
  • .claude/skills/fe-security/references/security.mdskill
  • .clinerules/fe-security.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-security.md
---
paths:
  - "**/*.html"
  - "**/*.jsx"
  - "**/*.tsx"
  - "**/*.js"
  - "**/*.vue"
  - "**/*.svelte"
  - "**/*.astro"
  - "**/*.component.html"
---

# Front-end security (frontend-skills)

Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked "is this safe".

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: Zed

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.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-security dla: JetBrains Junie

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.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-security dla: Kiro

  • .kiro/skills/fe-security/SKILL.mdskill
  • .kiro/skills/fe-security/references/security.mdskill
  • .kiro/steering/fe-security.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-security.md
---
inclusion: fileMatch
fileMatchPattern: ["**/*.html", "**/*.jsx", "**/*.tsx", "**/*.js", "**/*.vue", "**/*.svelte", "**/*.astro", "**/*.component.html"]
---

# Front-end security (frontend-skills)

Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked "is this safe".

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: Augment

  • .agents/skills/fe-security/SKILL.mdskill
  • .agents/skills/fe-security/references/security.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-security dla: Trae

  • .trae/skills/fe-security/SKILL.mdskill
  • .trae/skills/fe-security/references/security.mdskill
  • .trae/rules/fe-security.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-security.md
---
description: "Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked \"is this safe\"."
globs: **/*.html,**/*.jsx,**/*.tsx,**/*.js,**/*.vue,**/*.svelte,**/*.astro,**/*.component.html
alwaysApply: false
---

# Front-end security (frontend-skills)

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: Continue

  • .frontend-skills/skills/fe-security/SKILL.mdskill
  • .frontend-skills/skills/fe-security/references/security.mdskill
  • .continue/rules/fe-security.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-security.md
---
name: "Front-end security"
description: "Keeps front-end code from opening security holes in any stack - XSS sinks (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) and sanitizing, no eval, postMessage origins, secrets kept out of public env variables, CSP and HTTP-only headers, SRI, window.open, HTTPS. Use when rendering user or CMS content, embedding third parties, adding env variables or headers, or when asked \"is this safe\"."
globs: ["**/*.html", "**/*.jsx", "**/*.tsx", "**/*.js", "**/*.vue", "**/*.svelte", "**/*.astro", "**/*.component.html"]
alwaysApply: false
---

# Front-end security (frontend-skills)

- Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
- Never run strings as code: no `eval`, `new Function`, string timers (security/no-eval).
- `postMessage` names an exact origin; window message listeners check `event.origin` (security/postmessage-origin).
- Secrets never use a public env prefix (`NEXT_PUBLIC_`, `VITE_`, `PUBLIC_`); they stay in server code (security/no-secrets-in-client-env).
- Versioned CDN files carry `integrity` and `crossorigin`, or are self-hosted (security/sri-cdn).
- `window.open` to other sites passes `noopener,noreferrer` (security/window-open-noopener).
- `frame-ancestors`, `X-Frame-Options`, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
- Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
- Validate URLs before binding them to `href` or `src`: allow `https:`, `http:`, `mailto:`, `tel:` only.
- Auth cookies are set by the server with `Secure`, `HttpOnly` and `SameSite`; never write tokens into the DOM or URLs.
- Never say code "is secure"; say what was checked and what a person must review.

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

Gdzie trafia fe-security dla: Amazon Q Developer

  • .frontend-skills/skills/fe-security/SKILL.mdskill
  • .frontend-skills/skills/fe-security/references/security.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-security` (Front-end security): when editing `**/*.html`, `**/*.jsx`, `**/*.tsx`, `**/*.js`, `**/*.vue`, `**/*.svelte`, `**/*.astro`, `**/*.component.html`, first read `.frontend-skills/skills/fe-security/SKILL.md`.
Prawdziwy plik

Gdzie trafia fe-security dla: Aider

  • .frontend-skills/skills/fe-security/SKILL.mdskill
  • .frontend-skills/skills/fe-security/references/security.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-security` (Front-end security): when editing `**/*.html`, `**/*.jsx`, `**/*.tsx`, `**/*.js`, `**/*.vue`, `**/*.svelte`, `**/*.astro`, `**/*.component.html`, first read `.frontend-skills/skills/fe-security/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):

  • is this safe

A żeby sprawdzić i poprawić pracę:

  • Użyj skilla fe-security na tym pliku.
  • Uruchom audyt front-endu na moich zmianach i popraw wszystko, co poważne.
  • Wyjaśnij security/raw-html-sink i popraw to tutaj.

Reguły, których uczy

  • security/raw-html-sink

    Never pass user or remote data to a raw HTML sink (innerHTML, dangerouslySetInnerHTML, v-html, {@html}) without sanitizing it.

    poważnastatyczne

  • security/no-eval

    Front-end code never runs strings as code - no eval, new Function or string arguments to setTimeout and setInterval.

    poważnastatyczne

  • security/postmessage-origin

    postMessage names an exact target origin, and every window message listener checks event.origin against an allowlist.

    poważnastatyczne

  • security/no-secrets-in-client-env

    Secrets never use a client-exposed environment prefix (NEXT_PUBLIC_, VITE_, PUBLIC_, NUXT_PUBLIC_); they stay on the server.

    krytycznastatyczne

  • security/sri-cdn

    Versioned files from a public CDN carry Subresource Integrity (integrity plus crossorigin), or are self-hosted.

    umiarkowanastatyczne

  • security/window-open-noopener

    window.open for another site passes "noopener" (and "noreferrer" when needed) so the new page cannot control yours.

    drobnastatyczne

  • security/csp-meta-ignored

    frame-ancestors, report-uri, sandbox and X-Frame-Options are sent as HTTP headers; in a meta tag they do nothing.

    umiarkowanastatyczne

  • security/csp-strict

    Production pages send a strict Content Security Policy (nonces or hashes with strict-dynamic, object-src none, base-uri none).

    umiarkowanaw przeglądarce

  • security/https-only

    Every page and every resource it loads use HTTPS; no mixed content and no http:// links to your own site.

    poważnaw 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:

  • Never pass user, CMS or API data to a raw HTML sink unsanitized; render text, or sanitize with DOMPurify (security/raw-html-sink).
  • Never run strings as code: no eval, new Function, string timers (security/no-eval).
  • postMessage names an exact origin; window message listeners check event.origin (security/postmessage-origin).
  • Secrets never use a public env prefix (NEXT_PUBLIC_, VITE_, PUBLIC_); they stay in server code (security/no-secrets-in-client-env).
  • Versioned CDN files carry integrity and crossorigin, or are self-hosted (security/sri-cdn).
  • window.open to other sites passes noopener,noreferrer (security/window-open-noopener).
  • frame-ancestors, X-Frame-Options, HSTS and CSP reporting are HTTP headers, never meta tags (security/csp-meta-ignored).
  • Production sends a strict CSP with nonces or hashes (security/csp-strict); everything loads over HTTPS (security/https-only).
  • Validate URLs before binding them to href or src: allow https:, http:, mailto:, tel: only.
  • Auth cookies are set by the server with Secure, HttpOnly and SameSite; never write tokens into the DOM or URLs.
  • Never say code "is secure"; say what was checked and what a person must review.

Kroki, które wykonuje agent

  1. Search the change for sinks: innerHTML, outerHTML, insertAdjacentHTML, document.write, dangerouslySetInnerHTML, v-html, {@html}, set:html, bypassSecurityTrust. For each, trace where the value comes from.
  2. For rich text from a CMS or Markdown, sanitize once at a single helper (DOMPurify, configured once), and use only that helper.
  3. For new environment variables, decide server or browser first; give browser ones the framework prefix only if they are meant to be public.
  4. For a new third party: self-host or pin with SRI, load it async, list it in the CSP, and isolate untrusted HTML in a sandboxed iframe.
  5. Set security headers in the host configuration (_headers, vercel.json, next.config headers(), middleware), and verify them on the deployed response.

Jak agent sprawdza swoją pracę

  • npx github:dawidolko/frontend-skills audit --changed finds unsanitized HTML sinks, eval, unchecked postMessage, secret-looking public env variables, CDN files without SRI, window.open without noopener and headers placed in meta tags.
  • audit --url <page> adds Lighthouse's HTTPS and CSP checks on the rendered page.
  • Run the package manager's audit (npm audit --audit-level=high) in CI. A person reviews authentication, authorisation, data flows and server configuration.

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