10
23

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Angular 2 に入門してみてる

Last updated at Posted at 2017-01-09

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 の方が好きかな。

参考にしたページ

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

10
23
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
23

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?