Molte volte ci capita di voler provare degli snippet di codice, oppure di voler un ambiente il più leggero possibile in grado di permetterci di testare qualsiasi snippet di codice HTML/CSS/JS?

Ad oggi esistono molti editor online, come PasteBin, JSFiddle, CodePen, ma il loro scopo è più simile a creare ambiente usa-e-getta, in cui regna il timore di poter perdere quello su cui si sta lavorando, magari chiudendo involontariamente il browser.

Dall'altro lato, se volessimo fare qualcosa in locale, il primo pensiero è l'utilizzo di un boilerplate di Express, oppure un plugin di Node intallato globalmente, come http-server. Questi consentono di avere un ambiente pronto in pochissimo tempo, ma peccano in vari punti, tra i quali la necessità di installare ogni volta i node modules e l'assenza di un meccanismo di live reload, che tenga in sincronia il file su cui stiamo lavorando con quanto mostrato dal browser.

Per questi scopi possiamo utilizzare Live Server, disponibile all'indirizzo https://github.com/ritwickdey/vscode-live-server .

Si tratta di un'estensione sviluppata per VS Code, grazie alla quale il nostro unico pensierò sarà "Apri la cartella con Visual Studio Code"

Una volta installato, ci basterà cliccare sull'icona in basso a destra "Go Live!", e verrà creato un web server che distribuirà il nostro codice, ma non solo: il livereload sarà abilitato di default, se andremo a cambiare qualcosa nella pagina, l'interfaccia web si aggiornerà all'istante. Utile anche per chi sviluppa con VS Code in Container, infatti la porta verrà esposta in automatico verso l'esterno.