Come configurare il codice per la programmazione

Visual Studio Code (VS Codice) è uno dei redattori di codice più amati dagli sviluppatori. La tua elevata personalizzazione ti consente di adattare l'ambiente di sviluppo esattamente alle tue esigenze.

Dall'installazione alla configurazione di temi della tastiera, estensioni e scorciatoie, il codice VS offre numerose opzioni per migliorare la produttività.

Questo articolo ti guiderà dai passaggi essenziali per impostare il codice VS per la programmazione.

Installazione del codice VS

Scarica l'installatore

Per iniziare a configurare il codice VS, il primo passo è scaricare il programma di installazione. Visita il sito Web ufficiale del codice VS e fai clic sul pulsante di download.

Il sito identificherà automaticamente il suo sistema operativo e fornirà il giusto installatore.

Esecuzione dell'installazione

Una volta completato il download, fare clic sul file scaricato per avviare l'installazione. Seguire le istruzioni sullo schermo facendo clic su "Avanti" nei passaggi.

Non dimenticare di accettare i termini di utilizzo. Scegli la cartella in cui verrà installato il codice VS e procedere.

Configurazione del percorso

Nella fase finale dell'installazione, controllare l'opzione "Aggiungi al percorso". Questo è fondamentale per aprire il codice VS direttamente tramite il terminale, usando il comando codice.

Dopo aver contrassegnato questa opzione, fare clic su "Installa" e quando l'installazione è finita, fare clic su "Fine" per completare.

Pronto! Ora VS Code è installato e configurato sul sistema. Andiamo al passaggio successivo e iniziamo a esplorare le funzionalità di questo potente strumento di programmazione.

Scegliere temi e schemi di colore

Accesso alle preferenze

Per personalizzare il codice VS, vai alle preferenze. Vai al menu File> Preferenze> Tema del colore o semplicemente digitare Preferenze: tema del colore Nella tavolozza dei comandi. Questo aprirà un elenco di temi disponibili per la scelta.

Temi popolari

Ci sono molti temi popolari che possono personalizzare l'editore a tuo gusto. Alcuni dei più noti sono:

• Un professionista oscuro: Un tema oscuro molto popolare tra gli sviluppatori.
• Atomo una luce: Ideale per coloro che preferiscono un tema chiaro.
• Dracula: Un tema oscuro sviluppato da Zeno Rocha, un brasiliano.
• Tema dell'icona materiale: Oltre ai temi dei colori, è possibile modificare le icone del file in stile di progettazione del materiale.

Personalizzando il tuo tema

Se nessuno dei temi standard ti piace, puoi personalizzare il tuo tema. Accesso File> Preferenze> Impostazioni e cerca Workbench.colorcustomizzations.

Qui puoi regolare i colori di diversi elementi dell'interfaccia del codice VS.

Mancia: Puoi aggiungere personalizzazioni di colore al titolo e alle barre di stato all'interno della sezione Cololustomizzazioni.

Con questi suggerimenti, puoi rendere il codice VS a modo tuo e rendere il programma ancora più divertente!

Installazione di estensioni essenziali

Esplorare il mercato

Per installare estensioni sul codice VS, visitare il mercato. Marketplace è dove trovi tutte le estensioni disponibili per il codice VS. Per accedervi:

1. Apri il codice VS.
2. Fare clic sull'icona delle estensioni nella barra laterale sinistra o premere Ctrl+Shift+X..
3. Usa la barra di ricerca per trovare le estensioni che desideri.
4. Fare clic su Installare Per aggiungere l'estensione al codice VS.

Estensioni consigliate

Ecco alcune estensioni che possono migliorare notevolmente la tua produttività:

• Tag Rinomina automatica: Rinomina automaticamente i tag HTML corrispondenti quando si cambia uno di essi.
• Evidenzia il colore: Evidenzia i colori nel codice CSS, rendendo più facile visualizzare i colori utilizzati.
• Server live: Crea un server locale che aggiorna automaticamente la pagina del browser ogni volta che si salva un file.
• Più bello: Formatta automaticamente il codice, garantendo uno stile coerente.
• Eslint: Analizza il tuo codice JavaScript alla ricerca di errori e problemi di stile.
• Gitlens: Migliora l'integrazione GIT nel codice VS, mostrando informazioni dettagliate su commit e autori.

Gestire le tue estensioni

Dopo aver installato alcune estensioni, è possibile gestirle. Per questo:

1. Apri il pannello di estensione (Ctrl+Shift+X.).
2. Fai clic sull'icona degli ingranaggi accanto all'estensione che si desidera gestire.
3. È possibile disabilitare, disinstallare o configurare l'estensione secondo necessità.

Ricordare: Meno è meglio. Installa solo le estensioni che userai davvero per evitare il sovraccarico del tuo editor.

Configurazione della formattazione del codice

Regolazione delle preferenze di formattazione

È possibile regolare le preferenze di formattazione del codice sul codice VS. Accedi alle configurazioni premendo Ctrl (cmd) +, E cerca "formattazione durante il salvataggio".

Attiva questa opzione in modo che il codice venga formattato automaticamente ogni volta che si salva un file.

Formattazione durante il salvataggio

Una delle funzionalità più utili del codice VS è la formattazione automatica durante il salvataggio. Ciò garantisce che il tuo codice sia sempre pulito e organizzato.

Per attivare questa opzione, aggiungi la seguente riga al tuo file impostazioni.json:

{
    "Editor.FormatSaveSave": True
}

Utilizzo di strumenti più carini e altri

Più bello è uno strumento di formattazione del codice popolare. Aiuta a mantenere uno stile coerente in tutto il progetto. Per usarlo, segui questi passaggi:

1. Installare l'estensione più bella sul codice VS.
2. Aggiungi le impostazioni più belle al tuo impostazioni.json:

{
    "editor.defaultformterter": "esbenp.prettier-vscode",
    "[JavaScript]": {
        "Editor.DefaultFormatter": "Esbenp.prettier-Vscode"
    }
}

Ora, ogni volta che salvi un file, più bello formerà automaticamente il codice.

Il mantenimento del codice ben formattato non solo migliora la leggibilità, ma aiuta anche a evitare errori inutili.

Prova strumenti diversi e trova quello che si adatta meglio al tuo flusso di lavoro.

Personalizzazione delle scorciatoie da tastiera

Accesso alle impostazioni del collegamento

Per personalizzare le scorciatoie da tastiera sul codice VS, vai alla tavolozza di comandi premendo Ctrl + shift + p e tipo Preferenze: Apri scorciatoie da tastiera.

Questo aprirà una nuova scheda in cui è possibile vedere e modificare tutte le scorciatoie disponibili.

Creazione di nuovi collegamenti

Creare nuove scorciatoie è abbastanza semplice. Nella scheda di scelta rapida, fai clic sull'icona della matita accanto al comando che si desidera modificare e premere la combinazione di tasti che si desidera utilizzare.

Ricorda di scegliere combinazioni che non sono in conflitto con altri comandi importanti.

Impostazioni di importazione ed esportazione

Se si utilizza il codice VS in diverse macchine, potrebbe essere utile esportare le impostazioni del collegamento. Vai a F1> Preferenze: Apri Impostazioni (JSON) e copiare le impostazioni desiderate.

Per importare, basta incollare queste impostazioni nel file impostazioni.json della nuova macchina.

La personalizzazione delle scorciatoie da tastiera può aumentare notevolmente la produttività, permettendoti di lavorare in modo più efficiente e comodo.

Integrazione con Git

Configurazione di GIT nel codice VS

Visual Studio Code ha l'integrazione nativa con sistemi di controllo della versione come Git.

Per cominciare, aprire il pannello "Controllo sorgente" sul lato sinistro o utilizzare i comandi sulla barra di stato inferiore.

È possibile inizializzare un repository Git, eseguire commit, spingere e tirare e visualizzare e gestire le modifiche direttamente nell'editor.

• Inizializza un repository Git: Fare clic sull'icona GIT nella barra laterale e quindi nel pulsante di avvio del repository.
• Aggiungi file per impegnarsi: Mouse sui file modificati e fare clic su "Stage" per aggiungerli per impegnarsi.
• Commettere impegno: Fare clic su "Commettono messo in scena" per confermare le modifiche.
• Spingere per il repository remoto: Usa il comando Git Push nel terminale integrato o tramite l'interfaccia grafica.

Usando gitlens

Gitlens è una potente estensione che migliora l'integrazione GIT nel codice VS. Con esso, puoi visualizzare la storia degli commit, confrontare i cambiamenti e altro ancora.

Per installare gitlens:

1. Vai alla scheda VS Codice Extension.
2. Cerca gitlens e fai clic su Installa.
3. Dopo l'installazione, esplora le nuove funzionalità disponibili sul pannello di controllo sorgente.

Eseguire commessi e spingere

Per eseguire commessi e spingere il codice vs:

1. Apporta modifiche al codice: modifica normalmente i file.
2. Aggiungi le modifiche allo stadio: nel pannello di controllo sorgente, fai clic su "Fase tutto" per aggiungere tutte le modifiche.
3. Scrivi un messaggio da commit: nel campo del messaggio, descrivi le modifiche apportate.
4. Impegno commit: fai clic sull'icona di controllo per confermare.
5. Invia le modifiche al repository remoto: usa il comando Git Push Nel terminale integrato o fare clic sul pulsante sull'interfaccia grafica.

L'integrazione di Git con il codice VS facilita notevolmente il controllo della versione, consentendo di gestire il codice in modo efficiente e organizzato, il tutto in un unico posto.

Utilizzando il terminale integrato

Aprire il terminale

Per aprire il terminale integrato del codice VS, utilizzare il collegamento `ctrl + \

(Windows/Linux) oCMD + `(Mac). Ciò aprirà il terminale nella parte inferiore della finestra del codice VS, consentendo di eseguire comandi senza lasciare l'editor.

Comandi di navigazione ed in esecuzione

Il terminale integrato funziona come qualsiasi altro terminale. È possibile navigare tra directory, eseguire script, installare pacchetti e altro ancora. Ecco alcuni comandi utili:

• CD Per cambiare la directory.
• Ls O Dir Per elencare i file e le directory.
• Installazione NPM Per installare le strutture di un node.js. progetto.
• Python Script.py Per eseguire uno script Python.

Il terminale integrato consente di avere un maggiore controllo sull'ambiente di sviluppo senza cambiare tra diverse finestre o applicazioni.

Conclusione

L'impostazione del codice Visual Studio per la programmazione è un processo utile, poiché l'editor offre una vasta gamma di funzionalità e opzioni di personalizzazione.

Dall'installazione alla configurazione di temi, estensioni e scorciatoie da tastiera, ogni passaggio contribuisce a un ambiente di lavoro più produttivo e piacevole.

Goditi i suggerimenti e trasforma il codice nel tuo alleato principale durante la programmazione!