Gli strumenti del linguaggio sono pronti e sappiamo dove eseguire i comandi. Ora diamo al programma una posizione chiara. La cartella del progetto è il riferimento per sorgenti, configurazioni e percorsi. Aprirla nell’editor permette di vedere insieme i file che collaborano.
Perché usare una cartella di progetto
Un file può essere scritto da solo, ma un progetto cresce facilmente: un HTML collega un CSS, un programma importa un modulo e una build legge una configurazione. Conservare questi elementi in una cartella riconoscibile rende comprensibili i percorsi e riduce il rischio di avviare una copia diversa.
Per il primo esempio useremo una cartella chiamata primo-programma. Il nome è una convenzione didattica, non una parola richiesta dal linguaggio. Può stare nella directory dei propri progetti. Non è opportuno collocarla dentro la cartella dell’installazione di VS Code o in un’area temporanea senza sapere come conservarla.
Il progetto resta sul disco anche se la finestra viene chiusa. Il contenuto salvato non dipende dall’icona con cui lo si riapre. È utile poter riconoscere la stessa struttura anche con il gestore file del sistema.
Schema esplicativo originale creato per il capitolo.
Creare e aprire la cartella
Si può creare la directory dal gestore file e poi aprirla in VS Code. È un percorso semplice e non richiede la conoscenza dei comandi di shell. La creazione da terminale è un’alternativa quando si vuole rendere esplicita la posizione.
Windows
Nel gestore file crea la cartella in un percorso scelto. In VS Code usa File → Apri cartella e selezionala. Dal terminale PowerShell, un’alternativa è New-Item -ItemType Directory primo-programma, poi Set-Location primo-programma e code ., quando il comando code è disponibile.
Linux
Crea la cartella con il gestore file e aprila da File → Open Folder. Dal terminale puoi usare mkdir primo-programma, cd primo-programma e code .. Il comando mkdir opera nella directory corrente: controllala prima con pwd.
macOS
Crea la cartella nel Finder e aprila dal menu dell’editor. Dal terminale puoi usare mkdir primo-programma, cd primo-programma e code ., dopo aver preparato il comando code in PATH. Il percorso scelto deve essere quello in cui vuoi conservare il lavoro.
Quando compare una richiesta sulla fiducia della cartella, si valuta la provenienza. Una cartella appena creata con i propri file ha un contesto diverso da un repository sconosciuto. La decisione non va estesa automaticamente a tutte le directory superiori.
Nell’Esplora file controlla il nome della radice. Se vedi soltanto un documento e non la cartella prevista, potresti aver aperto un file singolo. Il titolo della finestra e la vista Esplora file aiutano a riconoscere il contesto.
Creare file e sottocartelle
- Seleziona la cartella in Esplora file.
- Usa il pulsante Nuovo file oppure il menu contestuale appropriato.
- Scrivi il nome completo, inclusa l’estensione.
- Conferma e controlla che il file compaia nel punto previsto.
- Per una sottocartella usa l’azione Nuova cartella, poi crea i documenti al suo interno.
Schermata Microsoft, documentazione VS Code. Fonte · CC BY 3.0 US. Riprodotta senza modifiche; versione e lingua possono differire dalla tua installazione.
Per il sito minimo index.html e stile.css possono stare nella stessa cartella. Per Python basta main.py. Per C# la CLI prepara un progetto con file aggiuntivi: seguiremo quella procedura nella pagina 1.7. Non si creano a mano cartelle di dipendenze per imitare un’installazione.
Nomi dei file ed estensioni
L’estensione aiuta editor e strumenti a identificare il contenuto. main.py è un file Python; main.cpp un sorgente C++; index.html un documento HTML. Rinominare un testo casuale in .cpp non lo trasforma in C++ valido, ma cambia il modo in cui gli strumenti tentano di leggerlo.
| Linguaggio o formato | Nome usato negli esempi | Nota |
|---|---|---|
| HTML | index.html | Documento della pagina |
| CSS | stile.css | Collegato dal documento HTML |
| JavaScript per Node | app.js | Avviato con Node nell’esempio |
| Python | main.py | Avviato con l’interprete selezionato |
| C | main.c | Compilato con il comando C |
| C++ | main.cpp | Compilato con il comando C++ |
| Java | Main.java | Corrisponde alla classe pubblica Main |
| C# | Program.cs | Fa parte del progetto .NET |
| PHP | main.php | Avviato dall’interprete PHP |
Un problema comune è un nome reale come main.py.txt, mentre il gestore file nasconde .txt. Si controlla il nome completo nell’Esplora file di VS Code o nelle proprietà del sistema. Anche maiuscole e minuscole possono contare: Linux e altri contesti possono distinguere Main.java da main.java.
I nomi semplici senza spazi facilitano i primi comandi. Gli spazi sono possibili in molti contesti, ma richiedono quoting corretto. Per progetti multipiattaforma si evitano nomi riservati e differenze basate soltanto su maiuscole.
Scrivere e salvare il contenuto
Il file aperto nell’editor riceve le modifiche. Salvare trasferisce il contenuto sul disco; il processo esterno normalmente legge quel contenuto, non una bozza ancora in memoria. La scheda mostra un indicatore quando esistono modifiche non salvate.
Windows
Usa normalmente Ctrl+S per salvare. Se il documento non ha ancora un percorso, la finestra Salva con nome richiede cartella e nome. Controlla che venga usata la radice prevista.
Linux
Usa normalmente Ctrl+S. I permessi della directory possono impedire la scrittura. Un messaggio di permesso negato riguarda il filesystem e non si risolve cambiando il linguaggio del documento.
macOS
Usa normalmente Cmd+S. Nella finestra di salvataggio controlla percorso e nome completo. Un file salvato in Download non entra automaticamente nella cartella del progetto aperta.
Auto Save può automatizzare alcuni salvataggi, ma non va presunto come attivo. Per il primo programma il salvataggio esplicito rende più chiara la sequenza: scrittura, salvataggio, elaborazione, risultato. Più avanti si potranno automatizzare operazioni senza perdere questa distinzione.
Riconoscere il linguaggio e orientarsi nel documento
La barra di stato mostra la modalità linguaggio. La colorazione è un segnale utile, ma non un controllo completo del programma. Se appare Plain Text / Testo normale, si verifica il nome; se serve, si cambia la modalità attraverso il selettore.
Schermata Microsoft, documentazione VS Code. Fonte · CC BY 3.0 US. Riprodotta senza modifiche; versione e lingua possono differire dalla tua installazione.
Le righe numerate facilitano la lettura di errori e riferimenti. Colore, font e tema possono differire dalla schermata. Il punto importante è individuare nome, contenuto, posizione e stato di salvataggio. Un file sintatticamente incompleto può essere salvato: il salvataggio non certifica validità del linguaggio.
Riaprire, rinominare e spostare file
Riaprire un documento dall’Esplora file mostra il contenuto salvato. Rinominare cambia il percorso e può richiedere aggiornamenti a import o collegamenti. Spostare un CSS senza modificare il link HTML può far scomparire lo stile pur lasciando entrambi i file presenti.
Quando l’editor propone di aggiornare riferimenti, si controllano le modifiche prima di presumere che siano complete. Il supporto dipende dal linguaggio e dall’estensione. Un riferimento costruito come stringa o usato da un sistema esterno può non essere riconosciuto.
Per gli esempi iniziali manterremo la struttura indicata nella pagina 1.7. Se si cambia il nome, si adegua anche il comando: node app.js non cerca automaticamente un file rinominato programma.js. Il nome scelto deve rimanere coerente tra sorgente, comando e configurazioni.
Scrivere un file e avviarlo sono operazioni distinte
Creare main.cpp produce un sorgente sul disco. Il compilatore produce un eseguibile con un altro nome; avviare quell’eseguibile produce un processo. Per Python il comando richiama l’interprete con il percorso del sorgente. Per HTML il browser legge il documento e le risorse collegate.
Questi percorsi hanno un punto comune: il file deve essere quello corretto e il contenuto deve essere salvato. Non si avvia una nuova compilazione selezionando semplicemente la scheda. Non si esegue PHP nel browser aprendo un file locale come se fosse HTML.
Nella pagina successiva le procedure mostreranno insieme sorgente, comando e risultato. I file scaricabili saranno organizzati per linguaggio, così non si mescoleranno artefatti o dipendenze di ambienti differenti.