Bàsic
Instal·la Visual Studio Code i aprèn a moure't per la seva interfície sense tocar el ratolí.
Introducció
Visual Studio Code és un editor de codi de Microsoft.
És gratuït, de codi obert, i el fa servir més de la meitat dels programadors del món.
No és un IDE com IntelliJ IDEA: de sèrie només edita text.
Tot el que sap fer amb un llenguatge concret —completar codi, executar tests, depurar— li arriba per una extensió.
Aquesta pàgina et fa una volta per la interfície.
No hi ha res a programar encara: només vols saber on és cada cosa i quines tecles la fan aparèixer.
Instal·lació
Instal·la VS Code amb l’instal·lador oficial: Install VS Code on Windows.
L’instal·lador afegeix VS Code a la variable d’entorn %PATH%.
Això vol dir que des d’una consola pots obrir l’editor amb l’ordre code:
code .El punt és la carpeta actual.
És l’ordre que faràs servir més: et posa a treballar dins la carpeta on ja ets.
Obre una consola, crea una carpeta hola i obre-la amb code.
Mostra la solució
mkdir hola
cd hola
code .Si la consola et diu que no coneix code, tanca-la i torna-la a obrir: encara tenia el %PATH% antic.
Interfície
La interfície de VS Code és deliberadament mínima.
Tot el que hi ha està al servei d’una sola cosa: el text que edites.
El primer que has de fer és posar la lletra a la mida que et vagi bé, igual que en un navegador:
| Ctrl + + | Fa la lletra més gran |
| Ctrl + - | Fa la lletra més petita |
Un cop hi vegis, val la pena conèixer les cinc àrees principals abans de començar a moure-les de lloc.
Activity Bar
La barra d’activitats és la columna d’icones de l’extrem esquerre.
Cada icona obre una vista diferent a la barra lateral:
| Explorer | Els fitxers i les carpetes del projecte |
| Search | Cerca i reemplaça per totes les carpetes obertes |
| Source Control | Els canvis que has fet, per gestionar-los amb Git |
| Run | Depuració: variables, punts d’interrupció, pila de crides |
| Extensions | Cerca, instal·la i desinstal·la extensions |
Les extensions que instal·lis hi poden afegir vistes noves.
Pots reordenar les icones arrossegant-les, i amagar-ne una amb el botó dret ➪ Hide from Activity Bar.
La teva disposició es conserva: la propera vegada que obris VS Code el trobaràs tal com el vas deixar.
Side Bar
La barra lateral mostra la vista que has triat a la barra d’activitats.
Si tornes a clicar la icona activa, es col·lapsa i recuperes tota l’amplada per al codi.
També ho pots fer amb Ctrl + B, que és molt més ràpid.
Editor
L’editor ocupa la major part de la pantalla, i és on edites els fitxers.
Pots partir-lo en dos amb Ctrl + </kbd> per veure dos fitxers alhora.
Panels
Sota l’editor hi ha els panells: la sortida del programa, els errors, els avisos i el terminal.
El terminal integrat és una consola dins de l’editor, oberta a l’arrel del teu projecte.
L’obres amb Ctrl + ñ.
Status Bar
La barra d’estat és la franja de baix de tot.
Diu coses del fitxer que tens obert i del projecte:
- La branca de Git en què treballes
- Quants errors i avisos hi ha
- La línia i la columna on és el cursor
- Si el sagnat és amb espais o amb tabuladors
- La codificació del fitxer
- El final de línia
- El llenguatge del fitxer
Cap d’aquests elements és només informatiu: si hi fas clic, canvies el que diu.
Obre un fitxer nou i escriu-hi print("hola").
El text es veu tot del mateix color, perquè VS Code encara no sap què és.
Fes clic a Plain Text a la barra d’estat i tria Python.
Mostra la solució
Ara print i "hola" es veuen de colors diferents.
VS Code no ha endevinat res: li ho has dit tu.
Quan deses el fitxer com a hola.py, ho dedueix de l’extensió i no cal que li diguis res.
Estàs llegint una vista prèvia.
Inicia sessió amb Google per llegir la pàgina completa.
Inicia sessió amb GoogleAmb qualsevol compte de Google. Només et demanarem que acceptis les condicions del servei.