7CC005 Workshop w2

Main Page >> Web Technologies >> Workbook >> Week 02 - Google Angular - part 1

Google Angular

You should spend 2 weeks working through The Tour of Heroes tutorial, located here:

• https://angular.io/docs/ts/latest/tutorial/

It is recommended that you cover sections 1-4 this week:

• 1. Introduction
• 2. The Hero Editor
• 3. Master/Detail
• 4. Multiple Components

Installing on mi-linux from Putty

First, go into your public_html folder, create a NEW folder and locate yourself inside it:

cd public_html
mkdir angular-2018
cd angular-2018

Then run the Angular installation, but WITHOUT the -g option (we are not allowed to install globally on mi-linux)

npm install @angular/cli

Note: The above will take a while...

Note: You should now have a "node_modules" directory inside your "angular-2018" directory... it contains Angular, including the "ng" command that we need next.

Next, we need to create a new project, which is done using the "ng new" command... only the "ng" command is buried inside the "node_modules" directory, so you have 2 options:

• specify its full path every time
• add it to your linux path

Running the command specifying the full path would look like something like this:

node_modules/@angular/cli/bin/ng new app-alix

Obviously replace "app-alix" with the name of YOUR app...

Once you have done the above, your "angular-2018" directory now contains Angular and YOUR app director:

drwxr-xr-x   4 in9352 acad    4096 Jan 31 12:52 .
drwxr-xr-x  73 in9352 daemon  4096 Jan 31 12:31 ..
drwxr-xr-x   6 in9352 acad    4096 Jan 31 14:29 app-alix
drwx------ 760 in9352 acad   24576 Jan 31 12:48 node_modules

GitLab

Important: Make sure that you commit your work to GitLab on a regular basis!