Edited at

Angular 2 に入門してみてる

More than 1 year has passed since last update.

WinJS やら React やらは使っているのですが、Angular (AngularJS、Angular 2 ともに) にはこれまで触ったことがなかったので、ちょっと触っておくかと思って入門してみました。 ちなみに TypeScript を使用します。


やったこと


  • 公式ドキュメントの Quickstart を見た。

  • 公式ドキュメントのガイドの Learning に沿ってチュートリアルとドキュメントを読むのを進めた。


    • 最初にローカル環境でチュートリアルを進めるためのセットアップ : Setup

    • 次にチュートリアル : Tour of Heroes tutorial

    • 最後にガイドのドキュメントを読み進め : Learning の 3 以降




やっていくのに役立ったもともとの知識


  • TypeScript の知識。

  • Android アプリ開発での Rx やら DI やらの知識。 (なくても困らないけど似てる部分もあるので学びやすかった。)

  • React の知識。 (なくても困らないけど似てる部分もあるので学びやすかった。)


感想

軽く触った感じの感想です。


  • セットアップのページにあるように、QuickStart seed プロジェクトをクローンしてくるだけでチュートリアルを始められる。 便利。


    • 実際のプロジェクトだともうちょっと構成変えたりすると思うのでこのままの構成を本番環境に持って行くことはないと思うけど、以下のことができる構成が整っている。


      • TypeScript のインクリメンタルビルドとローカルサーバーでの動作確認。

      • Karma による E2E テスト。

      • TSLint による Lint。



    • SystemJS を使ってる。 SystemJS を使ったことはなかったので参考になる。



  • チュートリアルもわかりやすくて良い。

  • 公式的に TypeScript がサポートされており、ドキュメントのソースコードも TypeScript だったりして、TypeScript で書きたい勢としてはやりやすい。

  • Angular は View 部分を扱うライブラリではなくてフレームワークなので、クライアントアプリを書く際の全体の構成の指針が示される感じ。 (そこは React と違うところだなーと思った。)


    • モジュールの仕組みや DI の仕組みが提供されている。 アプリケーション全体のテストについても考えられている。

    • ルーティングの仕組みを提供するモジュールもあるし、HTTP 通信に関するモジュールもある。

    • Web フロントエンドの SPA を書いたことがない、って人でもとっつきやすいのではないか。

    • 一方で View 部分だけを扱うライブラリを求めてる人にとっては 「これじゃない」 感がありそう。



  • コンポーネント同士を疎結合にしやすい仕組みになってる。 一方で React と比べて型の制約を付けにくい。


    • 個人的には React の方が好きかな。




参考にしたページ

公式ドキュメント以外で参考にしたもの。