Werkomgeving inrichten

Om Angular en de MEAN stack lokaal te gebruiken, heb je verschillende tools nodig die onderling met elkaar communiceren.
Zorg dat je voldoende admin-rechten hebt op je toestel!

Angular werkt met opdrachtregels die je uitvoert via een Command-line-interface (CLI).
Op Windows gebruik je standaard de Command Prompt (cmd.exe) of Powershell.
Op Mac gebruik je standaard de terminal.
Sommige IDE's, zoals WebStorm/PhpStorm en Visual Studio code hebben een ingebouwde terminal. Deze mag je natuurlijk ook gebruiken.
De schermafbeeldingen in deze cursus zijn hoofdzakelijk afkomstig van de GIT Bash terminal.
(Tip: met GIT Bash kan je ook Unix commado's uitvoeren zoals ssh, scp, cat, ...)
Je kan alle oefeningen perfect met de standaard terminal van het OS uitvoeren of met de terminal van je IDE!

Download steeds de laatste versie van de verschillende tools.
Omwille van de snelle evolutie komen de versienummers in onderstaande schermafbeeldingen misschien niet overeen met de versies die je zelf installeert.

Download de GIT client op: https://git-scm.com/downloads

Volg de standaard installatieprocedure.
Let op dat je tijdens de installatie zeker de optie "Windows Explorer Integration" aanvinkt!

Vink de optie 'Windows Explorer Integration' aan!

Plaats de cursor boven een willekeurige map en kies uit het snelmenu (rechts-klik) de optie GIT Bash Here.
Controleer de installatie met onderstaand commando:
$ git --version

$ git --version
git version 2.14.1.windows.1

node.js brengt JavaScript buiten de browser en gebruikt hiervoor de Chrome's V8 JavaScript engine.
npm (Node Package Manager) heb je nodig om de Angular CLI te installeren.
node.js en npm worden gelijktijdig geïnstalleerd.
We gebruiken node.js enkel als platform. We gaan in deze cursus geen node-programma's schrijven.
Download en installeer de laatste (current) versie van node.js via https://nodejs.org/en/
Volg de standaard installatieprocedure.

Open de terminal en controleer de installatie met het commando:
$ node -v && npm -v

$ node -v && npm -v
v8.4.0
5.3.0

De voorbeelden in deze cursus zijn geschreven in WebStorm (of PhpStorm). Beide producten zijn trouwens volledig gratis voor educatieve doeleinden. Volg de installatieprocedure zoals hieronder beschreven staat:

Maak een account aan op https://www.jetbrains.com/.
Gebruik bij de registratie je Thomas More mailadres!
Je ontvangt een mail "Complete your account registration" waarin je je registratie moet bevestigen.
Ga naar https://www.jetbrains.com/student/ en klik op "Apply Now".
Gebruik hier het mailadres waarop je in stap 1 geregistreerd bent.
Je ontvangt een tweede mail "JetBrains Educational Pack Confirmation" die je moet bevestigen.
Je ontvangt een derde mail "JetBrains Student License Confirmation" waarmee je je licentie moet activeren.
Installeer JetBrains Toolbox.
Vanuit de toolbox kan je vervolgens alle beschikbare software installeren.
Tijdens de installatie kan je de software registreren of activeren via je JetBrains Account.

Werk je in je vrije tijd ook met PHP, dan kan je beter PhpStorm installeren.
PhpStorm bevat dezelfde functionaliteit als WebStorm, maar aangevuld met extra PHP features.

Angular snippets voor WebStorm

WebStorm heeft al een vrij goede ondersteuning voor Angular, maar er bestaat nog een handige plug-in met interessante snippets.

Kies onder het File-menu Settings.
Open links het tabblad Plugins en klik rechts onderaan op Browse repositories.
Filter op Angular en installeer Angular 2 TypeScript Templates
Start WebStorm opnieuw op.