Cum să configurați vs codul pentru programare

Visual Studio Code (VS Code) este unul dintre cele mai populare editoare de cod în rândul dezvoltatorilor. Gradul său ridicat de personalizare vă permite să adaptați mediul de dezvoltare exact la nevoile dumneavoastră.

De la instalare la configurarea temelor, extensiilor și comenzilor rapide de la tastatură, VS Code oferă numeroase opțiuni pentru a vă spori productivitatea.

Acest articol vă va ghida prin pașii esențiali pentru configurarea VS Code pentru programare.

Instalarea VS Code

Descărcarea programului de instalare

Pentru a începe configurarea VS Code, primul pas este să descărcați programul de instalare. Accesați site-ul oficial VS Code și faceți clic pe butonul de descărcare.

Site-ul va identifica automat sistemul dvs. de operare și va furniza programul de instalare corespunzător.

Configurarea codului VSC

Efectuarea instalării

Odată ce descărcarea este completă, faceți clic pe fișierul descărcat pentru a începe instalarea. Urmați instrucțiunile de pe ecran, făcând clic pe “Next” în pași.

Nu uitați să acceptați condițiile de utilizare. Alegeți folderul în care va fi instalat VS Code și continuați.

Configurarea PATH

În etapa finală a instalării, bifați opțiunea “Add to PATH”. Acest lucru este esențial pentru a putea deschide VS Code direct din terminal, utilizând comanda cod.

După bifarea acestei opțiuni, faceți clic pe “Install” și, când instalarea este finalizată, faceți clic pe “Finish” pentru a încheia.

Asta este tot! VS Code este acum instalat și configurat pe sistemul dumneavoastră. Să trecem la pasul următor și să începem să explorăm funcționalitățile acestui instrument de programare puternic.

Alegerea temelor și a schemelor de culori

Accesarea preferințelor

Pentru a personaliza VS Code, mergeți la preferințe. Mergeți la Fișier > Preferințe > Tema de culoare sau pur și simplu tastați Preferințe: Tema de culoare în paleta de comenzi. Aceasta va deschide o listă de teme disponibile din care puteți alege.

Teme populare

Există multe teme populare care pot personaliza editorul după bunul plac. Unele dintre cele mai cunoscute sunt:

  • One Dark Pro: O temă întunecată foarte populară printre dezvoltatori.
  • Atom One Light: Ideal pentru cei care preferă o temă clară.
  • Dracula: O temă întunecată dezvoltată de Zeno Rocha, un brazilian.
  • Tema Material Icon: Pe lângă temele de culoare, puteți schimba pictogramele fișierelor în stilul Material Design.

Personalizarea temei dvs.

Dacă nu vă place niciuna dintre temele standard, vă puteți personaliza propria temă. Mergeți la Fișier > Preferințe > Setări și căutați workbench.colorCustomizations.

Aici, puteți ajusta culorile diferitelor elemente ale interfeței VS Code.

SfatPuteți adăuga personalizări de culoare pentru barele de titlu și de stare din cadrul secțiunii culoareCustomizări.

Cu aceste sfaturi, vă puteți însuși VS Code și puteți face programarea și mai plăcută!

Instalarea extensiilor esențiale

extensii esențiale

Explorarea pieței

Pentru a instala extensii în VS Code, mergeți la Marketplace. Marketplace este locul unde veți găsi toate extensiile disponibile pentru VS Code. Pentru a-l accesa:

  1. Deschideți VS Code.
  2. Faceți clic pe pictograma extensii din bara laterală din stânga sau apăsați Ctrl+Shift+X.
  3. Utilizați bara de căutare pentru a găsi extensiile dorite.
  4. Faceți clic pe Instalați pentru a adăuga extensia la codul VS.

Extensii recomandate

Iată câteva extensii care vă pot îmbunătăți considerabil productivitatea:

  • Auto Rename Tag: Redenumește automat etichetele HTML corespunzătoare atunci când modificați una dintre ele.
  • Culoare Highlight: Evidențiază culorile din codul CSS, făcând mai ușor de văzut ce culori au fost utilizate.
  • Server live: Creează un server local care vă actualizează automat pagina din browser ori de câte ori salvați un fișier.
  • Mai drăguț: Formatează codul automat, asigurând un stil consistent.
  • ESLint: Analizează codul JavaScript pentru erori și probleme de stil.
  • GitLensIntegrare Git îmbunătățită în VS Code, afișând informații detaliate despre comits și autori.

Gestionarea extensiilor dvs.

După instalarea unor extensii, este posibil să doriți să le gestionați. Pentru a face acest lucru:

  1. Deschideți panoul de extensii (Ctrl+Shift+X).
  2. Faceți clic pe pictograma rotiță din dreptul extensiei pe care doriți să o gestionați.
  3. Puteți dezactiva, dezinstala sau configura extensia după cum este necesar.

Amintește-țiMai puțin înseamnă mai mult. Instalați numai extensiile pe care le veți utiliza efectiv pentru a evita supraîncărcarea editorului.

Configurarea formatării codurilor

Reglarea preferințelor de formatare

Puteți ajusta preferințele de formatare ale codului dvs. în VS Code. Accesați setările apăsând CTRL (CMD) + , și căutați “Format on save”.

Activați această opțiune astfel încât codul să fie formatat automat ori de câte ori salvați un fișier.

Formatarea la salvare

Una dintre cele mai utile caracteristici ale VS Code este formatarea automată la salvare. Acest lucru asigură faptul că codul dvs. este întotdeauna curat și organizat.

Pentru a activa această opțiune, adăugați următoarea linie la fișierul dvs. settings.json:

{
    "editor.formatOnSave": true
}

Utilizarea Prettier și a altor instrumente

Prettier este un instrument popular pentru formatarea codului. Vă ajută să mențineți un stil consecvent în întregul proiect. Pentru a-l utiliza, urmați acești pași:

  1. Instalați extensia Prettier în VS Code.
  2. Adăugați setările Prettier la settings.json:
{
    "editor.defaultFormatter":"esbenp.prettier-vscode",
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    }
}

Acum, de fiecare dată când salvați un fișier, Prettier va formata automat codul.

Păstrarea unui cod bine formatat nu numai că îmbunătățește lizibilitatea, dar ajută și la evitarea erorilor inutile.

Încercați diferite instrumente și găsiți-l pe cel care se potrivește cel mai bine fluxului dvs. de lucru.

Personalizarea comenzilor rapide de la tastatură

Accesarea setărilor comenzii rapide

Pentru a personaliza comenzile rapide de la tastatură în VS Code, mergeți la paleta de comenzi apăsând Ctrl + Shift + P și tipul Preferințe: Deschidere comenzi rapide de la tastatură.

Aceasta va deschide un nou tab în care puteți vedea și modifica toate comenzile rapide disponibile.

Crearea de comenzi rapide noi

Crearea de noi comenzi rapide este foarte simplă. În fila scurtături, faceți clic pe pictograma creion de lângă comanda pe care doriți să o modificați și apăsați combinația de taste pe care doriți să o utilizați.

Nu uitați să alegeți combinații care nu intră în conflict cu alte comenzi importante.

Importul și exportul configurațiilor

Dacă utilizați VS Code pe diferite mașini, poate fi util să exportați setările comenzilor rapide. Mergeți la F1 > Preferințe: Deschideți setările (JSON) și copiați setările dorite.

Pentru a importa, pur și simplu lipiți aceste setări în settings.json a noii mașini.

Personalizarea comenzilor rapide de la tastatură vă poate crește considerabil productivitatea, permițându-vă să lucrați mai eficient și mai confortabil.

Integrarea cu Git

Configurarea Git în VS Code

Visual Studio Code are integrare nativă cu sisteme de control al versiunilor precum Git.

Pentru a începe, deschideți panoul “Source Control” din partea stângă sau utilizați comenzile din bara de stare inferioară.

Puteți să inițializați un depozit Git, să faceți commits, push și pull și să vizualizați și să gestionați modificările direct în editor.

  • Inițializarea unui depozit GitFaceți clic pe pictograma Git din bara laterală și apoi pe butonul de inițializare a depozitului.
  • Adăugați fișiere la commitPlasați cursorul peste fișierele modificate și faceți clic pe “Stage” pentru a le adăuga la comitere.
  • Efectuați commit-ulFaceți clic pe “Commit Staged” pentru a confirma modificările.
  • Push către depozitul de la distanță: Utilizați comanda git push pe terminalul integrat sau prin intermediul interfeței grafice.

Utilizarea GitLens

GitLens este o extensie puternică care îmbunătățește integrarea Git în VS Code. Cu ajutorul acesteia, puteți vizualiza istoricul comenzilor, puteți compara modificările și multe altele.

Pentru a instala GitLens:

  1. Mergeți la fila Extensii din VS Code.
  2. Căutați “GitLens” și faceți clic pe instalare.
  3. După instalare, explorați noile caracteristici disponibile în panoul de control al sursei.

Efectuarea de Commits și Push

Pentru a face commits și push-uri în VS Code:

  1. Efectuați modificări ale codului: editați fișierele în mod normal.
  2. Adăugați modificările pe scenă: În panoul de control al sursei, faceți clic pe “Stage All” pentru a adăuga toate modificările.
  3. Scrieți un mesaj de confirmare: În câmpul mesaj, descrieți modificările efectuate.
  4. Efectuați validarea: Faceți clic pe pictograma de verificare pentru a confirma.
  5. Trimiteți modificările la depozitul de la distanță: Utilizați comanda git push în terminalul integrat sau faceți clic pe butonul din interfața grafică.

Integrarea Git cu VS Code face controlul versiunii mult mai ușor, permițându-vă să vă gestionați codul într-un mod eficient și organizat, totul într-un singur loc.

Utilizarea terminalului integrat

utilizând terminalul

Deschiderea terminalului

Pentru a deschide terminalul integrat în VS Code, utilizați comanda rapidă `Ctrl + \'.

(Windows/Linux) sauCmd + ` (Mac). Acest lucru va deschide terminalul din partea de jos a ferestrei VS Code, permițându-vă să executați comenzi fără a părăsi editorul.

Navigarea și executarea comenzilor

Terminalul integrat funcționează la fel ca orice alt terminal. Puteți naviga între directoare, rula scripturi, instala pachete și multe altele. Iată câteva comenzi utile:

  • cd pentru a schimba directorul.
  • ls sau dir pentru a lista fișierele și directoarele.
  • npm install pentru a instala dependențele pentru un proiect Node.js.
  • python script.py pentru a rula un script Python.

Terminalul integrat vă oferă mai mult control asupra mediului dvs. de dezvoltare, fără a fi nevoit să comutați între diferite ferestre sau aplicații.

Concluzie

Configurarea Visual Studio Code pentru programare este un proces valoros, deoarece editorul oferă o gamă largă de funcționalități și opțiuni de personalizare.

De la instalare la configurarea temelor, extensiilor și comenzilor rapide de la tastatură, fiecare pas contribuie la un mediu de lucru mai productiv și mai plăcut.

Profitați de aceste sfaturi și transformați VS Code în principalul dvs. aliat când vine vorba de programare!

Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *