Visual Studio Code je definitivno jedan od najboljih editora za programere na tržištu. Mnogi će reći da u tu kategoriju spadaju i Sublime Text, Emacs, Vim i slični, no VS Code je, barem po nama, malo bolji od nabrojanih. Zato vam danas donosimo 10 savjeta kako biti produktivniji i kako lakše koristiti ovaj editor.
Za one koji ne znaju, VS Code je baziran na Elektronu, odnosno JavaScript aplikacija napravljena uz pomoć Elektrona. Elektron (engl. Electron) je jako sličan Atomu, ali je mnogo brži i nema problema s performansama kao većina JS aplikacija.
Ako se pitate – da, VS Code je open source dostupan na GitHubu i iza njega stoji Microsoft koji je napravio dotični editor za korisnike Linuxa, Maca, a zatim i Windowsa. Ako ga još niste probali, savjetujemo da to napravite sada i da ga skinete ovdje.

1) Savladajte Command PaletteKao i Sublime Text (i neki drugi editori) i VS Code ima nešto što se zove “command palette”. To je feature koji vam dozvoljava da izvršite određenu radnju umjesto da tražite opcije po menijima unutar editora. Da biste pokrenuli command palette, dovoljno je da stisnete kombinaciju tipki “Ctrl + Shift + P”. Samo počnite tipkati što želite napraviti. Npr. možete početi tipkati riječ “close” te ju “izvršiti” i tako zatvoriti VS Code. Tu su još i kategorije “File”, “Git”, “Terminal” … koje donose hrpu komandi pa ih naučite i svladajte. Olakšat ćete si život i nećete svako malo morati posezati za mišem.

2) Podesite si “working project” mapuAko kliknete na “Explorer” u navigacijskom sidebaru (izborniku) vidjet ćete da će se otvoriti subpanel. Taj subpanel će se podijeliti u dva dijela: Open Editors (fileovi koje imate otvorene) i “No Folder Opened”. Taj dio nas zanima..
Kliknite na “Open Folder” i otvorite si mapu u kojoj radite. VS Code će učitati sve datoteke iz te mape i ta mapa će postati “working” mapa. Unutar subpanela ćete onda moći kliknuti na datoteku i ona će se automatski otvoriti unutar editora. Nećete morati ići u Windows Explorer i tamo otvarati jednu po jednu datoteku.

3) Otvorite više datoteka odjednomVećina modernih editora nude nekakvo otvaranje više datoteka odjednom. Oni stariji to nude u obliku “tabova”, dok moderniji vam nude sve na istom ekranu. VS Code spada u ove modernije pa na jednom ekranu možete vidjeti paralelno više datoteka.
Ali se nadamo da imate malo veći ekran, jer ako otvorite 3+ datoteke na malom ekranu, bude prilično teško za snaći će i editirati te iste datoteke. No, na većim ekranima to izgleda odlično.
Spomenimo još samo da Code ima i “dynamic panels” pa kada otvorite više panela, oni se automatski sužavaju, odnosno proširuju. Onaj koji vam je aktivan se automatski proširi, dok se ostali malo suze. Jako zgodan i koristan feature.

4) Editirajte više linija odjednomAko trebate na više mjesta dodati liniju ili želite obrisati više linija odjednom, možete preko ugrađenog “multiple cursora”. To znači da samo stisnete tipku “Alt” (ili “Option” ako koristite Mac) i stavite kursor na više mjesta/linija. Sada počnite pisati nešto ili brisati. Na svim mjestima gdje ste postavili kursor, radit ćete istu akciju.
Ovo je izuzetno korisno kod pisanja HTML koda, gdje recimo želite dodati istu klasu na više mjesta i slično. No, korisno je i kod mnogih programskih jezika.

5) “Go to definition”Kada pišete programe/aplikacije ili skripte, često ćete naletjeti na metodu ili funkciju koju do sada niste susreli i ne znate što radi. Što napraviti u toj situaciji? Možete potrošiti par minuta dok ne nađete odgovarajuću datoteku s tom metodom/funkcijom ili možete označiti metodu koja vas zanima i stisnuti “F12”. Ako postoji definicija metode, VS Code će vas automatski odvesti na nju.
Ili možete iskoristiti “Alt + F12” kako biste dobili uvid u metodu bez da vas “baci” na istu.

6) Preimenujte metodu/varijablu gdje god da se pojavljujeRefactoring je nešto što svi programeri rade. Radi se o “uobičajenom” čišćenju i optimiziranju koda, no ponekad to može biti i prilično stresno i zadati vam glavobolju. Pogotovo kada refactorirate veće module pa morate preimenovati hrpu varijabli i metoda, a uvijek se nešto zaboravi pa projekt “puca” i naprave se novi bugovi.
Zato VS Code ima jako dobru mogućnost preimenovanja varijabli/metoda odjednom. Samo označite ono što želite preimenovati i stisnite “F2”. Ako želite preimenovati varijablu/metodu samo unutar jednog filea, stisnite “Ctrl + F2”. I to je to.

7) Pretražujte po svim datotekamaAko želite pretražiti više datoteka u projektu (mapi), možete vrlo jednostavno. VS Code se za sve pobrinuo. Kraticom “Ctrl + F” otvarate “find” prozor koji vam pretražuje otvorenu datoteku. Kraticom “Ctrl + Shift + F” otvarate također “find” prozor ali pretražujete sve datoteke koje imate u working projektu. Jako korisno.

8) Iskoristite integrirani Command Line u VS CodeuVS Code dolazi s integriranim terminalom, odnosno komandnom linijom. Na Windowsima se terminal prikazuje kao command prompt, dok na Macu i Linuxu kao terminal. Vrlo slično, ali ne u potpunosti. Točnije, na zadnje spomenute dvije platforme se otvara “Bash prompt”.
U svakom slučaju, otvaranjem komandne linije/terminala možete izvršiti određene naredbe bez ikakvih problema. Ako recimo programirate u ReactJS-u ili Angularu, preko terminala možete bez ikakvih problema upisati naredbu “npm start” i pokrenuti lokalni server i slično.

9) Instalirajte si novu temuKao što biste mogli i očekivati, VS Code ima hrpu tema koje možete iskoristiti. Te teme drugačije označavaju sintaksu, tekst i slično. Možda se čini nevažno, no dobra tema može jako povećati produktivnost. Zato imate VS Code Marketplace na kojem možete, između ostalog, naći hrpu dobrih tema pa pogledajte što se nudi.

10) Instalirajte third-party ekstenzijeZadnja mogućnost koju ćemo u ovom tekstu spomenuti je instalacija third-party ekstenzija. Kao što ste na VS Code Marketplaceu našli omiljenu temu, naći ćete tamo i hrpu dobrih ekstenzija. Ekstenzije su ključne za povećanje vaše produktivnosti. Tamo ćete naći razne ekstenzije za snippete, debuggere, nove jezike … sve što vam može olakšati život i korištenje VS Codea.

 

Piše: B.P.

Komentiraj

Please enter your comment!
Please enter your name here