Iniziamo questa nuova serie intitolata “Visual Code Extensions Series” in cui in cercherò di proporvi le migliori estensioni (settimanalmente) per Visual Studio Code che mi hanno permesso di essere più produttivo quotidiamente, automizzatizzando e snellendo alcuni processi.
Perchè Visual Studio Code? Beh, perchè è Free, Open Source e fruibile su qualsiasi piattaforma.
Ma anche statisticamente, VS Code è in forte crescita rispetto ai suoi competitor.
Statistica su scala mondiale nel periodo tra il 02-2018 e il 02-2019
(Sorgente: https://pypl.github.io/IDE.html)
Una delle parti più impressionanti di Visual Studio Code è la personalizzazione, specialmente tramite le estensioni. Se sei uno sviluppatore web, non sarai in grado di vivere senza installare queste estensioni (ve le consiglio davvero :-)).
1) Debugger per Chrome
https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome
Che ci crediate o meno, il debug di JavaScript significa molto più della semplice scrittura di istruzioni su console.log () (anche se è molto). Chrome ha funzioni integrate che rendono il debug un’esperienza molto migliore. Questa estensione ti offre tutte (o vicino a tutte) le funzionalità di debug all’interno del VS Code!
2) Javascript (ES6) Code Snippets
https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets
Questo è uno tra i miei preferiti.
Sono fermamente convinto che non sia necessario ridigitare lo stesso pezzo di codice più e più volte (inutile re-inventare la ruota no?)
Queste estensioni ti forniscono snippet per pezzi di codice scritti in JavaScript moderno (ES6).
Side note … se non stai utilizzando le funzionalità JavaScript di ES6, dovresti farlo!
3) Path Intellisense
https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense
Nei progetti di grandi dimensioni, ricordare nomi di file specifici e le directory in cui si trovano i file può diventare un lavoro oneroso e complicato.
4) Live Server
https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
Apporta modifiche nell’editor di codice, passa al browser e aggiorna per visualizzare le modifiche.
Questo è il ciclo infinito di uno sviluppatore, ma cosa succede se il tuo browser si aggiorna automaticamente ogni volta che apporti delle modifiche?
Ecco dove entra in gioco Live Server!
Esegue anche la tua app su un server localhost. Ci sono alcune cose che puoi testare solo quando esegui la tua app da un server, quindi questo è un grande vantaggio.
5) Browser Preview
https://marketplace.visualstudio.com/items?itemName=auchenberg.vscode-browser-preview
Adoro l’estensione Live Server (menzionata sopra), ma questa estensione fa un ulteriore passo avanti in termini di praticità. Ti dà un’anteprima live-reloading direttamente all’interno di VS Code. Non dovrai più collegarti al tuo browser per vedere una piccola modifica! Eccezionale davvero 🙂
Alla prossima settimana 🙂
