Utilizzo delle impostazioni utente in Visual Studio Code

Se non hai letto il post delle ultime settimane (e sei un membro del sito), ti esorto a farlo ora poiché questo riprende esattamente da dove si era interrotto il precedente.

In breve, inizieremo a parlare della configurazione di Visual Studio Code per lo sviluppo professionale di WordPress. Naturalmente, ciò solleva una domanda: cos’è lo sviluppo professionale di WordPress?

Se chiedi a dieci persone diverse, probabilmente otterrai 8-10 risposte diverse; tuttavia, lo definirei come l’utilizzo di pratiche di sviluppo software professionali nel contesto di WordPress.

Naturalmente, giusto? Ma cosa comporta?

Al di sopra della mia testa, penso a:

• Utilizzando adeguati strumenti di gestione delle dipendenze come Composer, NPM o Yarn,
• Debug utilizzando punti di interruzione (su var_dump ed echo),
• Sapere come formattare il codice usando un determinato standard (PSR nel caso che userò),
• Struttura organizzativa del file,
• Usare cose come Sass, JavaScript linting e così via per facilitare lo sviluppo

Ma prima di entrare in tutto questo, penso che sia importante configurare l’IDE in modo tale che appaia bene, funzioni bene con il modo in cui vogliamo e che capiamo come funziona in modo da poterlo modificare ulteriormente come il sorge il bisogno.

Quindi, nel post di oggi, esamineremo esattamente questo: capire come Visual Studio Code gestisce le impostazioni e un elenco proposto di opzioni di configurazione che ti aiuteranno a rendere la tua esperienza il più solida possibile.

Impostazioni utente in Visual Studio Code

Prima di iniziare, ti consiglio di scaricare Fira Code e di installare il font sul tuo sistema operativo preferito. Sebbene ci siano molti altri caratteri (come Source Code Pro) che sono anche belli, ho trovato Fira Code uno dei miei preferiti personali, specialmente con le sue legature (ma ne parleremo momentaneamente).

Questo è ciò che vedrai negli screenshot nel resto di questa serie.

1 Comprensione delle impostazioni

Innanzitutto, nota che Visual Studio Code ha un file predefinito che usa per le impostazioni nei suoi progetti. Lo noterai se vai al  menu Codice> Preferenze (o qualsiasi cosa sia simile al tuo sistema operativo.

In breve, tutto è impostato in un file JSON. Ecco dove diventa divertente: puoi personalizzare questo file essenzialmente sovrascrivendo ciò che fornisce utilizzando un file Impostazioni utente che fornisce.

E la cosa bella è che, sebbene sostituisca ciò che offre Visual Studio, l’IDE tornerà sempre alle impostazioni predefinite fornite con esso.

In questo particolare post, esaminerò semplicemente la definizione delle impostazioni dell’editor. Nei post futuri, tuttavia, esamineremo il lavoro con PHP, standard di codifica e altro ancora.

2 Configurazione delle impostazioni

Per questo post, presumo che tu abbia un progetto aperto. Questo può essere un nuovo progetto o un progetto esistente. Indipendentemente da ciò, ciò che ho intenzione di offrire sarà comunque valido.

In secondo luogo, darò suggerimenti in base al tipo di lavoro che svolgo più spesso. Anche se raccomando queste impostazioni per altri e anche se potremmo apportare piccole modifiche (ad esempio, alcuni linter non vogliono spazio attraverso cui passare attraverso questa serie sull’IDE, queste sono le cose più generali utilizzate per iniziare).

Quando apri per la prima volta il file, sarà vuoto. Ricorda, deve essere scritto in JSON corretto, altrimenti non funzionerà (per non parlare ora di un errore).

Ecco un esempio di ciò che ho nelle impostazioni del mio editor :

{
    // Editor Settings.
    "editor.fontFamily": "Fira Code",
    "editor.fontLigatures": true,
    "editor.fontSize": 13,
    "editor.renderWhitespace": "all",
    "editor.tabSize": 4,
    "editor.insertSpaces": true,
    "editor.detectIndentation": false,
    "editor.formatOnSave": false,

    "files.trimTrailingWhitespace": true,

    // ...
}

Ciascuno dovrebbe essere autoesplicativo; tuttavia, tieni presente che editor.fontLigatures è impostato su true poiché sto usando Fira Code. Questo cambierà alcune cose come = in una legatura.

Questo rende l’esperienza molto più piacevole durante la scrittura del codice.

3 Condivisione di progetti

Infine, una delle cose che trovo utili è avere progetti in un luogo che può essere condiviso tra più macchine. Questo può essere fatto tramite Google Drive, Dropbox o iCloud Drive.

In ogni caso, ti consiglio di fare quanto segue:

1. Mantenendo i tuoi progetti, supponi che non siano sensibili, ovviamente, in un servizio di condivisione di file,
2. Archivia ogni file dell’area di lavoro insieme ai file di progetto in detto servizio.

In questo modo, se scegli di utilizzare più macchine, dovresti avere i file di origine di cui hai bisogno per lavorare su ogni progetto. Ma non soffermerò il punto qui. Ne ho discusso in un post precedente e il processo continua a suonare.

Ho semplicemente sentito che indicarlo sarebbe stata una buona mossa nel caso in cui non fosse qualcosa che hai considerato.

Guardando gli standard di codifica

Ovviamente, questo post non è estremamente tecnico, ma inizieremo a implementare gli standard di codifica nel prossimo post e ciò richiederà un po’ di lavoro con Composer e con le impostazioni dell’utente.

E per assicurarci di essere in grado di farlo, ha senso gettare le basi per capire come funzionano le impostazioni in modo da poter continuare a modificarle in futuro.