Getting started

What has happened so far might not be impressive from someone else’s perspective because it was only “invisible” work.

I’ve started learning Angular from the official page. It requires learning TypeScript as well since it’s recommended there and poor little JavaScript seems neglected:

Angular + TypeScript

But I think that Angular is enough to start, the rest will come later. My first impression is that teaching to modularize code right in a tutorial is a great idea. Considering Angular itself, I’m surprised by the special Angular HTML attributes which differ much from those in Angular 1. For example, in order to iterate through a model collection, one had to write

	<li ng-repeat="person in people" ng-click="onSelect(person)">{{person.name}}</li>

to get a list of clickable names. Other Angular stuff was prefixed with “ng-” as well and explicitly visible in HTML source. Now they say it’s

	<li *ngFor="let person of people" (click)="onSelect(person)">{{person.name}}</li>

And it results in HTML elements like this:

	<li _ngcontent-gyu-0="">

Hm, nice.

By the way, I’ve noticed a mistake in the tutorial – there is a file missing in the presented initial structure:

Angular tutorial missing file

I took it from the sample base project just like all the other ones. When it’s not there, the page contains only “Cannot GET /” (although I have no idea where this message comes from yet).

I’m also getting familiar with Visual Studio Code as something more lightweight than full Visual Studio which I’m used to (the exchange is really useful when restarting is needed). I’m still confused by keyboard shortcuts and settings (I have to toggle word wrapping each time I open the same file, seriously?). As a welcome from Visual Studio Code, I’ve encountered an error:

Version mismatch! global tsc (1.8.34) != VS Code’s language service (2.2.1). Inconsistent compile errors might occur

because I had older TypeScript installed together with Visual Studio first. The environment variable PATH contained the location of the VS’s TypeScript. I fixed the problem by replacing this location with the directory where global npm modules are stored. To find that directory, run

npm list -g

and it will be at the beginning of the result.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s