Creare un progetto per Sito Web con Linux e VS Code

Visual Studio Code è stato annunciato da Microsoft nel mese di aprile del 2015 ed è stato lanciato ufficialmente nel mese di novembre dello stesso anno.
È stato un lancio significativo perché Microsoft ha reso disponibile un editor di codice multi-piattaforma e open source.
Un aspetto chiave nella storia di VS Code è stato il suo obiettivo di essere un editor di codice sorgente multi-piattaforma. Inizialmente, era disponibile per Windows, macOS e Linux.
Questa apertura verso diverse piattaforme ha contribuito a renderlo molto popolare tra gli sviluppatori che lavorano su diverse piattaforme.
Visual Studio Code è un software open source, il che significa che il suo codice sorgente è disponibile pubblicamente e può essere contribuito dalla comunità degli sviluppatori.
Questo ha favorito lo sviluppo di una vasta gamma di estensioni e plugin da parte di sviluppatori di tutto il mondo, consentendo agli utenti di personalizzare l'editor in base alle proprie esigenze.
Una delle caratteristiche distintive di Visual Studio Code è il suo ecosistema di estensioni.
Gli sviluppatori possono aggiungere estensioni per migliorare le funzionalità dell'editor, aggiungendo nuove funzionalità, lingue di programmazione e supporto per framework specifici questo permette a VS Code di essere un IDE molto versatile. Poiché Visual Studio Code è stato sviluppato da Microsoft, offre un'eccellente integrazione con altri strumenti e servizi Microsoft, come Azure.
Questa integrazione semplifica lo sviluppo e la gestione delle applicazioni cloud su Azure direttamente dall'editor.
Nel corso degli anni, Visual Studio Code ha guadagnato una comunità di sviluppatori molto attiva. Questa comunità partecipa alla crescita e all'evoluzione dell'editor attraverso il contributo di estensioni, segnalazione di bug e suggerimenti per nuove funzionalità.
Procediamo con la creazione del progetto, in caso non abbiate ancora installato VS Code Potete far riferimento a questa breve guida.
VISUAL STUDIO CODE INSTALL Premetto che per quosta guida ci sono alcune estensioni universali che possono migliorare notevolmente la tua esperienza di sviluppo web.
Ecco alcune estensioni essenziali per HTML, CSS, JavaScript e Git

ESLint

Per linguaggi JavaScript, TypeScript.
ESLint è uno strumento di analisi statica del codice che aiuta a mantenere il tuo codice JavaScript pulito e conforme agli standard di stile.
Questa estensione integra ESLint direttamente in VS Code, fornendo suggerimenti e correzioni automatiche per gli errori nel codice.

Prettier

Per linguaggi JavaScript, TypeScript, HTML, CSS, JSON, YAML e molti altri.
Prettier è uno strumento di formattazione del codice che ti aiuta a mantenere un codice ben formattato e coerente.
Questa estensione integra Prettier nel tuo ambiente di sviluppo, consentendoti di formattare il codice con facilità.

Live Server

Linguaggi supportati HTML, CSS, JavaScript.
Live Server è un'estensione che ti consente di avviare un server web locale direttamente da VS Code.
Questo è estremamente utile per il testing e lo sviluppo di pagine web in tempo reale. Puoi visualizzare le modifiche nel browser senza dover ricaricare manualmente la pagina.

GitLens

Linguaggi supportati Git.
GitLens è un'estensione per il controllo delle versioni Git che aggiunge funzionalità avanzate a VS Code.
Ti permette di visualizzare facilmente la storia delle modifiche, annotazioni di commit e persino di eseguire comandi Git direttamente dall'editor.

HTML CSS Support

Linguaggi supportati HTML, CSS.
Questa estensione migliora il supporto integrato di HTML e CSS in VS Code, fornendo suggerimenti intelligenti per il completamento del codice, la validazione e l'elaborazione dei file HTML e CSS.

Auto Rename Tag

Linguaggi supportati HTML, XML.
Auto Rename Tag semplifica la modifica dei tag HTML o XML. Quando rinomini un tag di apertura o chiusura, questa estensione si assicura che il tag corrispondente venga rinominato automaticamente.

Path Intellisense

Linguaggi supportati JavaScript, TypeScript.
Questa estensione fornisce un completamento automatico dei percorsi dei file e delle directory nel tuo codice, rendendo più facile il riferimento a file esterni nei tuoi progetti.

Queste estensioni dovrebbero coprire molte delle tue esigenze di sviluppo web su VS Code. Tuttavia, ricorda che ci sono molte altre estensioni disponibili per adattare l'editor alle tue specifiche necessità e preferenze.
Ora con Visual Studio Code cosi impostato sei pronto a muovere i primi passi.

Identifica la Directory di Apache

Prima di tutto, devi identificare la directory radice di Apache sul tuo sistema.
La posizione di questa directory può variare a seconda della distribuzione Linux che stai utilizzando.
Di seguito ci sono alcune posizioni comuni per la directory di Apache Su Ubuntu e derivate (come Debian) La directory di Apache generalmente si trova in

/var/www/html

Anche per CentOS, Fedora e derivate La directory di Apache è spesso in

/var/www/html

Su altre distribuzioni Linux, la posizione potrebbe variare.
Puoi trovare la directory di Apache cercando nel tuo sistema o consultando la documentazione della tua distribuzione.
E ora, caro programmatore intraprendente,hai aperto la directory di Apache in Visual Studio Code! Ecco, abbiamo appena svelato il segreto meglio custodito degli sviluppatori, una directory piena di codice incomprensibile!
Ma non preoccuparti, ora puoi sfidare il caos e cercare i tesori nascosti tra parentesi graffe e punti e virgola.