Angularをゼロから勉強してみます。
AngularとAngular.jsは別物なんですね。
##そもそもAngularの役割とは
主な役割は４つです。
- ビューをレンダリングする
- 変更検知
- ルーティング
- Ajaxの機能
それぞれ見ていきましょう。
###ビューをレンダリングする
データをHTML化する
###変更検知
データ変更時のMODELとDOM連携がGOOD
###ルーティング
ビューを変更する
###Ajaxの機能
サーバーへのアクセスが優れている
##公式を読む
公式を読みます。
公式ドキュメント
……んんん？？わ、わからん……！！
テンプレートとコンポーネントあたりはなんかわかる気がするが……。なるほど
SSRをしたりできるわけね、ふむふむ……。
ツアー・オブ・ヒーローズ アプリケーションとチュートリアルはスキップ！！
用語集も読もう。
いや多すぎる、全部はむりだ。
###まずはモジュールについて
NgModuleとはなんぞ？
なんか色々とライブラリと連携が取れる機能みたいですな。
これぞAngularの特色と言ってもいいみたい。
ライブラリをnpmでインストールし、JavaScriptのimportステートメントでそれらの一部をインポートして使っていくみたい。
NgModuleはインジェクターとコンパイラを設定し関連するものをまとメルものでもあるらしい。ふむふむ。
フィーチャーモジュールとは？
わからん。
フィーチャーモジュールの遅延ロードとは？
わからん。
モジュールに依存オブジェクトを提供する？？
わからん。
シングルトンサービス？？
わからないなあ。
ツリーシェイキング可能なプロバイダー??
わからないなあ。
すべてのアプリケーションには、少なくとも1つのAngularモジュール（rootモジュール）があり、 起動時にアプリケーションをブートストラップするために存在する必要があります。 慣例により、それは通常AppModuleといわれるみたいです。
###コンポーネント
コンポーネントの部分も読んでみます。
Angularテンプレート構文要素（{{hero.name}}、(click)、[hero]、）というのがあるらしい、なるほど……。Vueでいうv-ifとかに該当するものかな？
すべてのAngularアプリケーションには、少なくとも1つのコンポーネントがある……とのことです。ふうん。
このコンポーネントでテンプレートおよび関連するコンポーネント固有のメタデータを提供しています。ちなみにテンプレートにはHTMLと、HTML要素を表示する前に変更できるAngularマークアップがあります。
###ルーティング
こんな感じ↓のことをルーティングはやります。
- アドレスバーにURLを入力するとブラウザが対応するページに移動
- ページ上のリンクをクリックするとブラウザが新しいページに移動
- ブラウザの前後のボタンをクリックするとブラウザはあなたが見たページの履歴を前後にナビゲート
###ディレクティブ
Angularがレンダリングすると、ディレクティブの指示にしたがってDOMが変換されます。つまり「データ変更時のMODELとDOM連携がGOOD」なAngularの特製の一つを実現するために必要な機能ですね。
###パイプ
テンプレートHTMLの表示値変換を宣言。
なんのことかわからん……。
##YouTubeを見てみる
以下のユーチューブを見てみます。
いや〜やっぱりYouTubeはわかりやすい。
先にYouTube見ればよかった。
##Angular After Tutorial
次は以下のサイトを見ます。
ふむふむ……。勉強になるな……。
単一責任原則にのっとって「コンポーネントは１機能を持つ状態までに分割される」べきだそうな。
RxJSというライブラリの説明で、Observable……というのが出てきたけど、これなんだ？有限と無限のものがあるそうな。
インターセプターというのも登場。
うーん、わからない。
アプリケーションコンフィグの管理という項目もありました！！これはAngularの特色である「データ変更時のMODELとDOM連携がGOOD」ですね！これを実現するために抽象クラスなどを使用。プロバイダーは、アプリケーションのエントリポイントにおくべき。プロバイダの種類は提供したいものが何かによって変わります。オブジェクトなら値プロバイダー、などなど……。
##結論
理論だけ見てもなんのこっちゃですね。
YouTubeいいよ、YouTube。