Mozilla überarbeitet Online-Code-Editor Thimble

Mozilla hat einen Relaunch seines Online-Code-Editors Thimble vollzogen. Thimble ist als Teil des Mozilla Learning Networks auf HTML-Anfänger fokussiert und erlaubt das einfache Erstellen und Veröffentlichen von Webseiten direkt im Browser.

Mozilla Thimble präsentiert sich in ganz neuem Glanz, was bereits bei der Domain beginnt. Statt wie bisher unter thimble.webmaker.org ist Thimble nun unter thimble.mozilla.org erreichbar und präsentiert sich als Teil des Mozilla Learning Networks (teach.mozilla.org), nachdem Webmaker mittlerweile primär die Smartphone-App zum Erstellen von Inhalten bezeichnet und wie Thimble als Tool des Mozilla Learning Networks aufgeführt wird.

Thimble sieht nicht nicht nur völlig neu und wesentlich moderner als zuvor aus, Thimble ist auch unter der Haube vollkommen neu. So basiert Thimble nun beispielsweise auf dem community-geführten Open Source Editor Brackets von Adobe. Änderungen im Code werden nun umgehend in der Vorschau angezeigt, ohne dass erst ein Button geklickt werden muss. Neue Editor-Features sind unter anderem eine Autovervollständigung für Code und das Hervorheben von Webseiten-Teilen bei Anklicken der entsprechenden Code-Stellen. Außerdem erlaubt Thimble nun das Erstellen mehrerer Dateien für ein Projekt, das Wechseln zwischen einer Desktop- sowie einer schmaleren Smartphone-Ansicht in der Live-Vorschau und die Option, zwischen einem dunklen und einem hellen Farbschema für den Code-Editor zu wechseln. Per Tastenkombination Strg + K (Mac: Cmd + K) wird eine Inline-Dokumentation zum ausgewählten Code-Element angezeigt. Auch das Hochladen von Bildern oder anderen Dateien ist nun möglich. Wird ein Archiv hochgeladen, wird dieses online entpackt und die einzelnen Dateien können bearbeitet werden. Beim Einbinden von Bildern wird im neuen Thimble die Option angeboten, ein Selfie aufzunehmen.

[lightbox style=“modern“ image_path=“https://www.soeren-hentzschel.at/wp-content/uploads/thimble.png“ popup=“https://www.soeren-hentzschel.at/wp-content/uploads/thimble.png“ link_to_page=““ target=““ description=““ size=“two_col_small“ alt=“Mozilla Thimble“]

Link zum Original-Video