Modern Web Guidance: Coding-Agenten auf moderne Web-Plattform-Schreibweisen umstellen

Für wen

Wenn ein Coding-Agent bei Overlay, Animation oder Interaktion große Mengen veraltetes JavaScript aufhäuft, du aber Fähigkeiten der heutigen Web-Plattform nutzen willst, passt dieses Skill-Set besser. Es bettet Web-Plattform-Erfahrung, Best Practices und Browserkompatibilitätsdaten in den Coding-Agenten ein, um Lösungen von alten Mustern zur modernen Plattform zu drehen, nicht um ein weiteres allgemeines Front-End-Tutorial zu schreiben.

Offizielle Begründung: Coding-Agenten fallen oft auf alte Muster zurück, weil Trainingsdaten viel Altcode enthalten, und erzeugen oft aufgeblähte Skripte für Aufgaben, die schon native, leistungsfähige Plattformlösungen haben. Arbeitest du an Dialogen, Top-Layer-Animation oder Kompatibilitätsprüfung und akzeptierst ein Skill-Set mit npx, ist der Nutzen direkter. Wer nur Dokumentation durchsehen und Agentenverhalten nicht ändern will, kann zuerst die Kommandozeilen-Suche nutzen und muss den Installationsassistenten nicht zuerst starten.

Ersten Versuch in 3 Minuten abschließen

Der offizielle Installationseinstieg ist nur dieser:

npx modern-web-guidance@latest install

Er startet einen interaktiven Assistenten und installiert Modern Web Guidance in deinen Coding-Agenten. Das ändert die Skill-Konfiguration des Agenten auf diesem Rechner; es ist keine Nur-Lese-Abfrage. Vor der Ausführung bestätigen: dieser Rechner hat npx, du willst die Auswahl im Assistenten beenden, und das ist die Agentenumgebung, in die geschrieben werden soll. Hinweise lesen, dann ausführen; in einer unklaren Umgebung nicht einfach Enter.

Nach der Installation eine umkehrbare Prüfung: den Agenten «wie animiert man den Dialog-Hintergrund» prüfen lassen und verlangen, zuerst moderne Plattformfähigkeiten zu sehen, nicht zuerst ein langes Skript zu schreiben. Erfolgssignal: die Antwort lehnt sich an Plattformlösungen und Kompatibilität, statt standardmäßig Alt-Schreibweisen zu stapeln. Gibt der Agent weiter nur alte Muster, bei der Prüfung stoppen; keine Repository-Dateien ändern lassen.

Bist du noch nicht bereit, in den Agenten zu schreiben, kannst du zuerst dieselbe CLI für eine Nur-Lese-Suche nutzen (nächster Abschnitt). Dieser Schritt ersetzt die Installation nicht; er bestätigt nur, dass der Befehl geht.

Anwendungsfälle

Fall 1: Passende Leitfäden nach Aufgabe suchen. Du hast schon einen konkreten Bedarf, etwa Dialog-Hintergrund animieren, kennst den Leitfadennamen aber noch nicht. Im Terminal ausführen:

npx modern-web-guidance@latest search "animate a dialog modal backdrop"

Offiziell als Search for relevant guides gekennzeichnet. Die Seite schreibt nicht, wie viele Zeilen zurückkommen, die Sortierung oder ob zuerst installiert werden muss. Bestätigen kannst du nur: dieser Befehl sucht Leitfäden nach Stichwort. Einträge zu Dialog, Hintergrund und Animation reichen; er berechtigt dich nicht, Suchergebnisse als endgültigen Patch zum Einfügen zu verstehen.

Fall 2: Einen Leitfaden per bekannter ID holen. Wenn du schon eine Kennung wie animate-to-from-top-layer gesehen hast, ausführen:

npx modern-web-guidance@latest retrieve "animate-to-from-top-layer"

Offiziell als Retrieve a guide by ID gekennzeichnet. Es erklärt kein vollständiges ID-Inventar und schreibt nicht, ob retrieve Projektdateien ändert. Beim ersten Mal die Ausgabe nur als Leitfaden-Fließtext lesen. Soll sie in Code landen, einem Coding-Agenten mit bereits installiertem Skill zum Abgleich geben und klar verbieten, Dateien vor deinem Nicken zu ändern.

Nutzungsgrenzen

Das ist eine Vorschau. Offiziell wird Inhalt weiter ergänzt, Beiträge oder Feedback willkommen unter

https://github.com/GoogleChrome/modern-web-guidance-src

Die Seite garantiert nicht, dass Leitfäden die ganze Web-Plattform abdecken, und schreibt nicht, ob Befehle in der Vorschau stabil sind. Ist ein Thema nicht auffindbar, heißt das nur, der aktuelle Inhalt hat es noch nicht; keine «äquivalente Best Practice» selbst ergänzen.

Installationsweg ist der interaktive Assistent oben; Suche und Abruf sind zwei andere Befehle. search / retrieve nicht als zweiten Installer verstehen und nicht folgern, es sei an ein Agentenprodukt gebunden. Offiziell nur coding agents, keine Client-Namensliste.

Beim ersten Mal Suche oder Nur-Lese-Abgleich durch den Agenten bevorzugen. Der Assistent schreibt Skills; retrieve erklärt auch nicht, ob es nur Anzeige ist. Jeder Schritt, der Repository oder Konfiguration ändern würde, muss zuerst den Agenten die zu ändernden Dateien hersagen lassen; du bestätigst, dann weiter.