そんなわけで、記事にまとめるほどの知見はないので、個人的なメモです。

AngularJSとAngularは違うもの

AngularJSはバージョン1系で、ただのAngularがバージョン2以降です。
名前は、Angularとついていますが、ほとんど違うもので、使いまわせるコードなどもありません。

Angular CLIでプロジェクトを作成する

開発するために、コマンドラインを利用するのが、デファクトスタンダードとなっています。
新規ファイルを作成するときの下準備や、webpackでビルドするなど、一通りの機能があります。

TypeScriptで記述するのがベスト

JavaScriptの欠点を補うため、マイクロソフトが作ったプログラミング言語です。
利用しなくても、開発できるみたいですが、TypeScriptの作法に従って、コーディングするのが良いです。

アロー関数式

TypeScriptのアロー関数式は、記述が省略できるだけでなく、thisが保たれるので、非常に重要です。

// このような記述が、
let y = function(x){
	return x * 2
};

// こうも書ける
let y = (x) => {
	return x * 2
};

// こうも書ける
let y = x => x * 2;

構造的部分型

型が、構造的に一致すれば、互換性があると認識します。
それを構造的部分型と言います。
(型が、ガチガチすぎても、any型でチェックされなくても困るので、そういう機能がついたのでしょうか?)

ジェネリック

型を抽象化して扱うための機能です。
型を活かす機能なので、見た目の形だけでも覚えておきましょう。
名前に「T」を使用することが多いです。

function test(x: T): T {
  return x;
}

class Test{
  public data: T;
}

RxJS

Angularでは、非同期の処理を実行する際に、RxJS(Reactive Extensions for JavaScript)が利用されています。
RxJS自体は、別の技術ですが、覚えましょう。

テストツール

Angular CLIで作業していると、最初からJasmineKarmaといったツールで、テストできるようになっています。

エディタ

マイクロソフトからTypeScriptのプラグインが提供されているので、有名どころのエディタなら問題ありません。

  • Visual Studio Code
  • Atom
  • Sublime Text
  • IntelliJ IDEA(WebStorm)

まとめ

Angularは、フルスタックなフレームワークなので、学習コストが高いです。
しかし、これから必要になりそうなスキルが複数あるので、無駄になりません。

できるだけ覚えたほうが良いでしょう。
それでは、また!

Angularデベロッパーズガイド  高速かつ堅牢に動作するフロントエンドフレームワーク
宇野 陽太 奥野 賢太郎 金井 健一 林 優一 吉田 徹生
インプレス (2017-12-15)
売り上げランキング: 58,784