Web-Entwicklung im Browser- CodeSandbox mehr als ein Online Editor ...

... unterstützt Node, React, Vue, Angular, Gatsby, Nuxt, Next, CxJs, Dojo, Preact, Svelte, Reason, Adonis, Apollo, Ember, Quasar und mehr ...

Hi,
ich teste gerade den Online-Editor CodeSandbox [1,2,3,4].
Wer mal eben etwas ausprobieren möchte oder den Code sharen/embeden möchte kennt sicher sowas wie CodePen o. SassMeister.

CodeSandbox geht weiter.
Da ist zunächst der Editor.
Wer "Visual Studio Code" nutzt wird sich gleich wohl fühlen (CTRL-SHIFT-P). Tatsächlich nutzt CodeSandbox den Ms-Editor - nur halt im Browser.
Man hat ( fast ) alles was man von VSC gewöhnt ist: Themes, Emmet, Console, Code-Vervollständigung usw..

Man kann vorhandene ( public ) Sandboxes "forken" um diese zu editieren, lokale Projekte einfach online in eine Sandbox schieben ( via den CodeSandbox CLI Tool [5] ),
ein GitHub Repo klonen und synchronisieren, ein Sandbox Projekt herunterladen
oder, basierend auf fertigen CodeSandbox Templates bzw. Container von scratch beginnen.

Bei den Templates unterscheidet CodeSandbox zwischen Client- und Server Templates [3,4,6].
Erstere laufen ausschließlich im Browser und sind entsprechend vorkonfiguriert. So bietet das "Vanilla" Template [3] Unterstützung für .js. ts, .html, .pug, .scss, .sass, .less, .css, .styl, .png etc..
Alles inkl. der In-Browser Vorschau mit Hot-Reloading via "Parcel".

Das ( Server- ) Template [4,6] "Node" z.B. bietet volle Node Unterstützung ( Instanzen basierend auf den offiziellen Node.js Docker-Images ).
Man kann alle Node Module ( packagist.org ) einfach installieren und nutzen.
Man kann sogar auf ein Bash Terminal zugreifen - alles im Browser.

Eigene Node-Scripts ( package.json ) können in der ( Browser- ) Shell wie gewohnt gestartet werden oder innerhalb des Editors aufgerufen werden ( Yarn ).
Weitere Templates für React, Vue uvm. existieren.

Nach Anmeldung erhält man ein übersichtliches Dashboard mit seinen Sandboxes, man kann Teams erstellen und gemeinsam am Code arbeiten oder zu einer Live-Coding Session einladen.
Eigene Templates können aus vorhandenen Sandbox Projekten erstellt werden - Alles kostenfrei.

Wer sich finanziell beteiligt erhält zusätzliche Features ala private Sandboxes usw. s.: https://codesandbox.io/patron

Bin beeindruckt ...

[1]CodeSandbox
[2]CodeSandbox Documentation
[3]Introducing the Vanilla Template to CodeSandbox
[4]Announcing CodeSandbox Containers
[5]CodeSandbox CLI Tool
[6]How we make npm packages work in the browser