Figure professionali per il DEVELOPER PLATFORM usando il framework ASP NET: parte 3, personalizzare l’editor Visual Studio Code

Dopo aver visto i comandi da finestra terminale e da riga di comando con il comando dotnet seguito da qualche cosa e anche come installare pacchetti aggiuntivi con NuGet, approfondiamo Visual Studio Code, l’editor leggero e snello che ci consentirà di programmare in C# senza appesantire troppo il nostro hard disk, editor che abbiamo imparato a conoscere da https://umbriawayincrementa.wordpress.com/2020/09/03/figure-professionali-per-il-developer-platform-usando-il-framework-asp-net-parte-2-entrare-nel-vivo-con-i-comandi-dotnet-da-finestra-terminale-e-usifruire-di-pacchetti-aggiuntivi-con-nuget/. L’editor si può scaricare da https://code.visualstudio.com/ e l’errore che si fa spesso è quello di considerare questo editor in apparenza limitato alle potenzialità offerte da un ambiente integrato come Visual Studio. Grazie all’ uso di estensioni può supportare una enorme quantità di linguaggi e risolvere problemi tecnici tra i più svariati, nonchè migliorare la qualità della nostra programmazione manuale, basti pensare ad Emmet per esempio, indirizzo https://emmet.io/ ; Una volta aperto Visual Studio sulla sinistra presenta alcune voci di menù come la sezione HELP dove ci conviene dare una sbirciatina a INTRODUCTORY VIDEOS mentre sulla destra ci sono ulteriori approfondimenti da spulciare alla voce INTERACTIVE PLAYGROUND. Anche INTERFACE OVERVIEW è da visionare perchè spiega i cinque link a incona sulla barra laterale sinistra. Certamente l’ultimo riquadro delle estensioni è molto importante. Esiste una finestra terminale che si lancia con CTRL + ò da dove posso lanciare i miei comandi dotnet. Posso cambiare anche il tema e i colori anche usando la COMMAND PALETTE in alto e cercando THEME. Si lavora molto con gli short-cut ossia con le combinazioni di tasti. Per lavorare in C# devo installare l’estensione specifica e ricaricare per rendere effettiva l’installazione. Anche OMNISHARP va installato perchè invia il codice dall’ editor al compilatore funzionando da PONTE. In questo modo scrivendo il codice mi verrà suggerito il metodo che voglio applicare. Quando scrivo il codice se erro nella digitazione ho la possibilità di capire che cosa c’è che non funziona posizionandomi sopra e azionando omnisharp che indicherà l’anomalia da correggere. Poi abbiamo dei FIX utili per il refactoring con delle lampadine visualizzate che per esempio ci indicheranno delle using non più necessarie. Facciamo un piccolo riassunto sugli accessi rapidi:

  • con F1 apro la command palette di Visual Studio Code per le interrogazioni veloci
  • per aprire e chiudere il terminale integrato in Visual Studio Code CTRL+ò
  • Mostrare i fix per migliorare il codice e correggere gli errori si usa CTRL+.
  • Compilare l’applicazione CTRL + SHIFT + B
  • Per aumentare e ridurre lo zoom UI CTRL++ e CTRL +-

A questo punto dobbiamo investigare le capacità di debugging dell’ editor. Un BUG è un errore che abbiamo commesso e che dobbiamo correggere. Il debugger è uno strumento software che va a scandagliare il codice a caccia di errori. L’interazione è anche bidirezionale perchè posso forzare la chiusura del flusso in punti specifici per capire se fino a quel punto vi erano anomalie. Con F5 si avvia l’applicazione di debug. In alto compare una barra fluttuante che ci consente di stoppare o riavviare l’applicazione. Il breakpoint è un punto di interruzione così il debug si arresterà proprio in quel punto. Con F9 fisso i punti di stop. In questo modo posso ispezionare gli oggetti anche nei sottolivelli di difficoltà composti da altri oggetti e da altre proprietà. CTRL + S salva le modifiche e F5 ripristina l’applicazione. CTRL + SHIFT + F5 ricompila il codice e rende effettive eventuali modifiche. I breakpoint sono così definiti in wikipedia: “nell’ambito dello sviluppo del software, un breakpoint è un punto di interruzione nel codice di un programma, normalmente usato per scopi di debugging. Un breakpoint è sostanzialmente uno strumento che consente di eseguire un programma con la possibilità di interromperlo in punto desiderato oppure quando si verificano determinate condizioni, allo scopo di acquisire informazioni su un programma in esecuzione. In particolare, il programmatore può analizzare eventuali file di log, lo stato delle variabili o dei registri, e così via, per verificare se il programma funziona come previsto o, in caso contrario, per risalire alla causa del malfunzionamento (bug)”. Il pannello WATCH sulla sinistra è molto importante perchè copiando il metodo sul pannello scopriamo se la condizione VERA per esempio e non crea problemi.Con CTRL + T posso cercare codice specifico all’ interno dei file con il simbolo del cancelletto. Cont CTRL + SHIFT + O ricerco con il simbolo di chiocciola ma non tutte le ricerche fanno uso di simboli come per esempio il contenuto dei file XML. Tutto ciò per migliorare la navigabilità dell’ applicazione al posto di impazzire manualmente cercando i file individualmente.Con CTRL + P non ho prefissi e simboli e posso cercare direttamente i file. CTRL + G posso cercare per riga di codice, ricerca molto utile quando il compilatore segnala errori su un file alla riga Numero X per esempio. ALT freccia a destra o ALT e freccia a sinistra posso navigare tra le classi e i rispettivi file che la utilizzano, tutto ciò ci responsabilizza sull’ enorme varietà di tecniche messe a disposizione dall’ editor per navigare il codice senza fare diecimila click sui file, con gli short-cut e le scorciatoie da tastiera possiamo davvero velocizzare la nostra programmazione. RIASSUMENDO con Umbriaway Consulting: per aprire un nuovo progetto, clicchiamo il menu File > Open Folder…, oppure premiamo i tasti Ctrl+K e subito dopo Ctrl+O (questo è quel che si chiama un “accordo”). Infine selezioniamo la directory principale del progetto ASP.NET Core, ovvero quella in cui si trova il file .csproj. All’apertura di un qualsiasi file C#, se abbiamo già installato l’estensione C#, ci verrà proposto di creare la configurazione necessaria per avviare e debuggare l’applicazione con Visual Studio Code. Accettando, verrà creata una sottodirectory .vscode che contiene tutta la configurazione di build e avvio del progetto corrente. L’applicazione può essere così avviata in debug con il tasto F5. Visual Studio Code possiede una Command Palette, che consiste di una casella di testo polivalente che è richiamabile con varie scorciatoie da tastiera. In base alla scorciatoia usata, la Command Palette offre funzionalità diverse: Con F1 si predispone alla ricerca ed esecuzione di uno dei comandi disponibili in Visual Studio Code. Alcuni di questi comandi sono anche richiamabili dai menu (ad esempio: impostazione del tema per cambiare i colori e lo stile dell’interfaccia); con Ctrl+P permette di cercare e aprire file in base al nome; con Ctrl+T si attiva la ricerca per simbolo in tutta l’applicazione. Un simbolo è un elemento nel codice sorgente che possiede un nome, come ad esempio una classe, un metodo, una proprietà, un campo privato, una costante, un’enumerazione, un’interfaccia e così via; con Ctrl+Shift+O si cerca tra i simboli locali, ovvero definiti nel file di codice C# attualmente aperto; con Ctrl+G si può saltare alla riga indicata del file attualmente aperto.