0 Reaktionen

MDN Playground: Mozilla integriert CodePen-Alternative in Entwickler-Dokumentation

Geschätzte Lesedauer:

Mozilla hat seine Entwickler-Dokumentation MDN Web Docs um einen interaktiven Code-Editor erweitert, der an das populäre CodePen erinnert.

Für sehr viele Webentwickler stellen die MDN Web Docs eine wichtige Anlaufstelle dar, wenn es um die Dokumentation von Webtechnologie geht. Mit dem MDN Playground hat Mozilla nun eine Erweiterung implementiert, welche es einfacher macht, mit den dort gezeigten Code-Beispielen zu experimentieren.

Das Prinzip erinnert an das populäre CodePen: Es gibt separate Eingabefelder für HTML, CSS sowie JavaScript, in denen Code eingetragen und sofort ausgeführt werden kann. Dabei bietet der Editor auch Code-Vervollständigungen während der Eingabe. Außerdem gibt es ein Anzeigefeld für Konsolen-Ausgaben, Code kann per Knopfdruck formatiert werden und wer angemeldet ist, kann seinen Code per Link mit anderen teilen.

MDN Playground

Was den MDN Playground besonders interessant macht: Viele Code-Beispiele in den MDN Web Docs haben einen Play-Button. Wird dieser gedrückt, öffnet sich genau der Code aus dem Beispiel in einem MDN Playground. Auf diese Weise kann das Gelesene sofort getestet und verändert werden.

Die Nutzung des MDN Playgrounds ist kostenlos und erfordert kein MDN Plus.

Mit dem MDN AI Help hat Mozilla außerdem eine Künstliche Intelligenz als weitere große Neuerung der MDN Web Docs online gebracht. Dieser wurde in einem separaten Artikel vorgestellt.

Unabhängige Berichterstattung unterstützen.

Unterstütze wirklich unabhängige und Fakten-basierte Berichterstattung zu Mozilla, welche nicht das Ziel hat, Schlagzeilen zu produzieren, sondern objektiv zu informieren.

Dieser Artikel wurde von Sören Hentzschel verfasst.

Sören Hentzschel ist Webentwickler aus Salzburg. Auf soeren-hentzschel.at informiert er umfassend über Neuigkeiten zu Mozilla. Außerdem ist er Betreiber von camp-firefox.de, der ersten Anlaufstelle im deutschsprachigen Raum für Firefox-Probleme aller Art. Weitere Projekte sind firefox.agenedia.com, firefoxosdevices.org sowie sozone.de.

Und jetzt du! Deine Meinung?

Erforderliche Felder sind mit einem Asterisk (*) gekennzeichnet. Die E-Mail-Adresse wird nicht veröffentlicht.
  1. Nach Absenden des Kommentar-Formulars erfolgt eine Verarbeitung der von Ihnen eingegebenen personenbezogenen Daten durch den datenschutzrechtlich Verantwortlichen zum Zweck der Bearbeitung Ihrer Anfrage auf Grundlage Ihrer durch das Absenden des Formulars erteilten Einwilligung.
    Weitere Informationen