Forward Advance Learning

NG-cli

The ng-cli is a command line tool for Angular. It gives you:

  1. Generators to build new projects and components.
  2. A server, to serve your app in development and production.
  3. Live reload.
  4. A test runner for unit, and E2E tests.
  5. A build tool, with minifation and cache busting.

install with:

npm install @angular/cli -g

Now create a new app with

ng new myapp

start a server with:

cd myapp
ng serve

Viewing in a browser

Open up http://localhost:4200/ to check your work in a browser. This is a live-reloading server, so any change you make is immediately visible.

Generating Components

You can generate new components using:

ng generate component cats

This will make you a new cat-component, complete with tests and templates.

Likewise for services, directives, etc.

Find the full documentation here: https://github.com/angular/angular-cli/wiki

Exercise - Hello World

Use the ng-cli to build yourself a simple hello world app.

Exercise - Attack the Dungeon

Generate an attack the dungeon app. Port your code over to it. For good measure, add a header, footer and some styling.