Node.JS 2: První projekt

Minule jsme si řekli spíše teoretické zákulisí Node.JS, dnes si už umažeme ruce od opravdového kódu. Osobně používám jako IDE (prostředí pro psaní kódu) WebStorm, rozhodně se ale nenechte odradit, používáte-li IntelliJ Idea s Node.JS pluginem, Sublime text, Eclipse, Visual Studio nebo mnohá další. Jen na tuto episodu asi uspoříte čas, najdete-li si to někde jinde, kde pracují s odlišným IDE.

Vytvoření projektu

  • Nastartujeme Webstorm. V levém horním rohu rozklikneme File -> New -> Project...
  • Vybereme hned první - Empty project.
  • Odklikneme tlačítko Create.
  • Nyní je třeba chvíli posečkat, IDE vytváří celý nový ( i když prázdný) projekt.
  • V levém spodním rohu rozklikneme záložku Terminal.
  • Ve chvíli, kdy uvidíme adresu končící naším právě vzniklým souborem ( u mě např.: C:\Users\ProgramujuSAran\WebstormProjects\untitled1 ), napíšeme npm init (init - inicializace) a odřádkujte enterem.
  • Chviličku strpení, za nějaký čas nám naběhne text ( předposlední řádka říká: "Press C at any time to quit" ).
  • Odřádkujeme rovnou několikrát, končíme po dotázání se "Is this OK?(yes)".
  • Opět odenterujeme, uvidíme adresu končící jménem našeho projektu (např. untitled1).
  • Napíšeme npm install. Čekáme, čekáme a zase čekáme.
  • Poté, co se objeví adresa končící jménem projektu: File -> Settings (Ctr + Alt + S) -> Languages & Frameworks (levý užší sloupec) -> Node.js and NPM -> nahoře zaškrtneme políčko Coding Assistance for Node.js.

Vytvoříme nový Javascriptový soubor, sám si zvolím název - např. index.js.

Kód

Nyní index.js obohatíme o funkční kód:

let a = 1;
let b = 2;
let soucet = a + b;

Nabízejí se nám dvě možnosti, jak výsledek vypsat do konzole:

console.log("Součtem čísel " + a + " a " + b + " je "+ soucet);

A nebo pomocí obrácených apostrofů a ${proměnnéVTextu}:

console.log(`Součtem čísel ${a} a ${b} je ${soucet}.`);

Výsledný kód:

let a = 1;
let b = 2;
let soucet = a + b;
console.log("Součtem čísel " + a + " a " + b + " je "+ soucet);
console.log(`Součtem čísel ${a} a ${b} je ${soucet}.`);

Výpis z konzole:

Součtem čísel 1 a 2 je 3
Součtem čísel 1 a 2 je 3.