Fähigkeiten Frontend Security Coder
🔒

Frontend Security Coder

Sicher

Sichern Sie Ihren Frontend-Code

Frontend-Anwendungen sind anfällig für XSS, CSRF und andere Angriffe. Diese Skill generiert sichere Code-Muster und identifiziert Schwachstellen in Ihren Webanwendungen, um vor gängigen Angriffsvektoren zu schützen.

Unterstützt: Claude Codex Code(CC)
🥉 73 Bronze
1

Die Skill-ZIP herunterladen

2

In Claude hochladen

Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen

3

Einschalten und loslegen

Teste es

Verwendung von "Frontend Security Coder". Generate a XSS-safe input component in React that sanitizes user input

Erwartetes Ergebnis:

Eine React-Komponente mit ordnungsgemäßer Eingabebereinigung mit DOMPurify, Ausgabe-Kodierung und sicherheitsfokussierter Prop-Validierung.

Verwendung von "Frontend Security Coder". Write CSRF protection code for a JavaScript application

Erwartetes Ergebnis:

JavaScript-Modul mit Fetch-Wrapper, das automatisch CSRF-Tokens anfügt, Antworten validiert und Token-Aktualisierung handhabt.

Verwendung von "Frontend Security Coder". Create a secure authentication pattern for a SPA

Erwartetes Ergebnis:

Vollständiges Authentifizierungsmodul mit httpOnly-Cookies, Refresh-Tokens mit sicherem Speicher und automatischer Sitzungsverwaltung.

Sicherheitsaudit

Sicher
v1 • 2/25/2026

This is a prompt-only skill that generates frontend security content. No executable code was detected. The skill provides security guidance through natural language prompts without any system-level access, network calls, or file operations. Risk score is 0/100.

0
Gescannte Dateien
0
Analysierte Zeilen
0
befunde
1
Gesamtzahl Audits
Keine Sicherheitsprobleme gefunden
Auditiert von: claude

Qualitätsbewertung

38
Architektur
100
Wartbarkeit
87
Inhalt
50
Community
100
Sicherheit
83
Spezifikationskonformität

Was du bauen kannst

Sichere Komponentenentwicklung

Generieren Sie sicherheitsbewusste React-, Vue- oder Angular-Komponenten mit integriertem XSS-Schutz und Eingabevalidierung

Sicherheits-Code-Review

Erhalten Sie detaillierte Sicherheitsanalysen von Frontend-Code-Snippets mit spezifischer Schwachstellenidentifikation und Remediation-Anleitungen

Lernen von Sicherheits-Best-Practices

Lernen Sie sichere Codierungsmuster und -praktiken für die Frontend-Entwicklung durch generierte Beispiele und Erklärungen

Probiere diese Prompts

Grundlegender XSS-Schutz 
Generate a XSS-safe input component in [FRAMEWORK] that sanitizes user input and prevents script injection attacks. Include proper escaping functions.
CSRF-Token-Handler 
Write a CSRF token management module for a frontend application. Include token retrieval, validation on requests, and automatic token refresh logic.
Sicherer Authentifizierungsfluss 
Generate a secure authentication flow pattern for a single-page application. Include token storage best practices, refresh token handling, and session timeout logic.
CSP-Konfigurationsanleitung 
Create a comprehensive Content Security Policy configuration for a modern web application. Include directives for scripts, styles, images, and API calls.

Bewährte Verfahren

  • Validieren und bereinigen Sie Benutzereingaben immer sowohl client- als auch serverseitig, auch wenn eine clientseitige Validierung vorhanden ist
  • Verwenden Sie moderne Sicherheitsbibliotheken wie DOMPurify für HTML-Bereinigung, anstatt eigene Escape-Funktionen zu schreiben
  • Implementieren Sie Content-Security-Policy-Header, um eine zusätzliche Schutzschicht gegen XSS-Angriffe zu bieten

Vermeiden

  • Verwendung von innerHTML mit benutzerbereitgestellten Daten ohne Bereinigung - dies erzeugt direkte XSS-Schwachstellen
  • Speichern sensibler Tokens in localStorage statt in httpOnly-Cookies - Tokens sind für JavaScript zugänglich
  • Deaktivieren des CSRF-Schutzes für API-Endpunkte, weil es Komplexität hinzufügt - dies setzt die Anwendung Cross-Site-Request-Forgery-Angriffen aus

Häufig gestellte Fragen

Durchsucht diese Skill meine bestehende Codebasis nach Schwachstellen?
Nein, diese Skill generiert sicherheitsfokussierten Code und Muster aus Prompts. Sie analysiert keine externen Codebasen.
Kann diese Skill ein Sicherheitsaudit ersetzen?
Nein, diese Skill bietet Codierungsanleitung und Muster. Sie kann professionelle Sicherheitsaudits oder Penetrationstests nicht ersetzen.
Welche Frameworks unterstützt diese Skill?
Die Skill kann Code für React, Vue, Angular, Vanilla JavaScript und andere gängige Frontend-Frameworks generieren.
Funktioniert der generierte Code sowohl mit Frontend als auch Backend?
Die Skill konzentriert sich auf Frontend-Sicherheitsmuster. Backend-Sicherheit erfordert serverseitige Implementierungen, die von dieser Skill nicht abgedeckt werden.
Wie verwende ich dies mit Claude Code oder Codex?
Aktivieren Sie die Skill und stellen Sie spezifische Prompts zu dem Sicherheitsmuster, das Sie benötigen. Die Skill generiert entsprechenden Code und Erklärungen.
Sind die Sicherheitsempfehlungen aktuell?
Die Skill generiert Empfehlungen basierend auf etablierten Sicherheitspraktiken. Verifizieren Sie diese immer gegenüber aktuellen Sicherheitsstandards und OWASP-Richtlinien.

Entwicklerdetails

Autor

sickn33

Lizenz

MIT

Repository

https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/frontend-security-coder

Ref

main

Dateistruktur

📄 SKILL.md