OpenAI & ChatGPT · Foto: Kevin Rheese, CC BY 2.0
Modern Web Development Assistant
Typ
Prompt
Lizenz
CC0-1.0 (Public Domain)
Anwendungsfeld
Prompt-Bibliothek
Voraussetzungen
Keine besonderen — direkt loslegen.
Kurzer Rollen-Prompt, der die KI als Full-Stack-Entwickler und UI/UX-Designer für HTML, CSS, JS, React und Node.js positioniert.
Der Prompt
Act as an expert full-stack web developer and UI/UX designer. Help me build modern, responsive, and professional websites using HTML, CSS, JavaScript, React, Node.js, and databases when needed. Generate clean, optimized, and well-structured code with proper comments and best practices.
So nutzt du es
Den Prompt-Text kopieren (Button oben) und als System-Prompt bzw. erste Nachricht in ChatGPT, Claude oder einem lokalen Modell einfügen. In ChatGPT lässt er sich unter „Anweisungen für ChatGPT“ dauerhaft hinterlegen.
Der Prompt-Text ist englisch — er funktioniert trotzdem in deutschen Unterhaltungen. Für deutsche Antworten einfach am Ende ergänzen: „Antworte auf Deutsch.“
Im Detail
Kompakter Rollen-Prompt, der die KI dauerhaft als Full-Stack-Entwickler und UI/UX-Designer positioniert und für saubere, kommentierte Best-Practice-Codeausgabe in HTML, CSS, JavaScript, React, Node.js sowie Datenbanken sorgt. Anders als eine Einzelfrage etabliert er eine Rolle für die gesamte Session, sodass nachfolgende Anfragen automatisch im gewünschten Stil beantwortet werden. Eignet sich für Einsteiger und Fortgeschrittene, die durchgängig moderne Webprojekte umsetzen und nicht bei jeder Anfrage erneut Kontext und Qualitätsanspruch erklären wollen. Der Prompt ist bewusst allgemein gehalten — für spezialisierte Aufgaben wie reine Barrierefreiheit oder Fehlersuche sind fokussierte Prompts präziser.
Praxis-Tipp
Als erste Nachricht einer neuen Konversation einsetzen, damit die KI die Entwickler-Rolle für alle folgenden Fragen in dieser Session beibehält.
Siehe auch
Lizenz & Quelle
- Lizenz: CC0-1.0 (Public Domain)
- Quelle: awesome-chatgpt-prompts (GitHub)
Inhalt ansehen (modern-web-development-assistant.txt)
Lade …
Erfahrungen & Kommentare.
Funktioniert der Prompt bei Ihnen? Tipps, Stolperfallen, Varianten — teilen Sie es mit der Community.
Lade Kommentare …
Passt dazu.
aa/cli taste
Legt feste Tech- und Stilvorgaben für CLI-Projekte fest (pnpm, TypeScript, Commander.js, klare Ordnerstruktur).
Accessibility Auditor
Lässt die KI als Accessibility-Experte auf WCAG-2.2- und Section-508-Konformität prüfen.
Analyze code scanning security issues and dependency updates if vulnerable
Priorisiert GHAS-Sicherheitsalerts über mehrere Repos und trennt Dependency- von Base-Image-Ursachen.
