← Priprema

Lekcija 2 od 4 ⏱ 15 minuta

Instalacija uređivača VS Code

Instalirat ćemo program u kojem ćeš pisati kod. Besplatan je, a koriste ga i profesionalci.

Što je VS Code i zašto baš on

Visual Studio Code (ljudi ga zovu skraćeno VS Code) je uređivač – program za pisanje koda. Zamisli ga kao Word, ali za programere: oboji tvoj kod, daje ti savjete i ukazuje na greške. Potpuno je besplatan, a ljudi u najvećim tvrtkama na svijetu koriste ga za izradu web stranica. Nauči ga sada i ostati će ti zauvijek.

⚠️

Instaliraj ga uz odraslu osobu. Neka ti roditelj sjedi uz tebe – sama instalacija je sigurna, ali dobro je da znaju što se instalira na računalo.

Instalacija na Windowsu

  1. Otvori code.visualstudio.com i klikni veliki plavi gumb Preuzmi za Windows.

  2. Kad se datoteka preuzme, klikni na nju (naći ćeš je u traci zadataka dolje ili u mapi Downloads).

  3. Prihvati licencu (označi Prihvaćam ugovor), zatim samo nastavi klikati Dalje. Na koraku Dodatni zadaci označi Stvori ikonu na radnoj površini da imaš ikonu na radnoj površini.

  4. Klikni Instaliraj i pričekaj. Na kraju klikni Završi – VS Code će se otvoriti.

Instalacija na Macu

  1. Otvori code.visualstudio.com i klikni Preuzmi za macOS.

  2. Kad se datoteka preuzme, pronađi je u mapi Downloads. Ako je .zip datoteka, dvaput klikni da je raspakiraš.

  3. Pojavit će se plava ikona Visual Studio Code. Povuci je u mapu Applications. To je to, instalirano je.

  4. Otvori mapu Applications i dvaput klikni Visual Studio Code da ga pokreneš. Prvi put Mac će pitati želiš li ga stvarno otvoriti – klikni Otvori.

Upoznavanje s VS Codeom

VS Code govori puno jezika – kratko ćemo pogledati okolo i osjećati se ugodno:

  1. Na lijevoj bočnoj traci klikni ikonu koja izgleda kao složeni kvadratići (Proširenja). Izgleda kao četiri mala bloka.

  2. U okvir za pretraživanje na vrhu upiši Prettier (ili bilo koji naziv teme koji ti se sviđa, npr. Dracula ili Night Owl).

  3. Odaberi nešto što ti se sviđa i klikni Instaliraj pored toga.

  4. Mali prozor može iskočiti dolje desno – slijedi što predlaže. VS Code će odmah primijeniti tvoj odabir.

Provjeri sam sebe: VS Code se otvara i izgleda spremno za rad, s izbornikom na vrhu (Datoteka, Uredi, Odabir…). Ako je tako, sve je spremno i tvoja radionica je gotova!

Što ćeš ponijeti iz ovog poglavlja