200911Jun

JS Bin: HTML/CSS/JS-Code im Browser testen

Mit JS Bin hat Remy Sharp ein interessantes Projekt entwickelt, mit dem sich JavaScript-, HTML- und CSS-Code live im Browser testen lässt. Die Seite des Projekts ist schlicht und schnell verständlich — so gibt es die drei Bereiche "JavaScript", "HTML" und "Output", die der Benutzer separat aktivieren kann. Bei den beiden Schaltflächen für JavaScript- und HTML-Code werden jeweils Texteingabefelder eingeblendet, in die der Benutzer Quelltext eingeben kann. Anschließend wird mit einem Klick auf die Output-Schaltfläche das Ergebnis in einem iframe-Bereich geladen bzw. aktualisiert.

JS Bin

Der Benutzer kann damit schnell Skripte und HTML/CSS-Konstrukte erstellen und testen. Zudem unterstützt JS Bin die Einbindung von JavaScript-Frameworks wie jQuery, jQuery UI, Prototype, Scriptaculous, YUI, MooTools, Dojo oder Ext JS — es dürfte also für jeden Geschmack etwas dabei sein. Es können sogar AJAX-Anwendungen live getestet werden, wie das Video demonstriert.
Schließlich gibt es noch die Funktion "Save to public URL", die einen spezifischen Link generiert, der den HTML-Output des Benutzers enthält. So kann die gerenderte Ausgabe auch in einem Tab angesehen und mit Firebug analysiert werden.