Angularを使ってみる（Angular）
「JavaScript」って、１つしかないんじゃないの？（語彙力）
と思ってしまったものの、サっとggってみると
自分の知識が古くて震えたので、メモメモ…。
（１）Angularとは
Googleが開発した、JavaScriptフレームワークの一つ
（２）フレームワークとライブラリの違い
①ライブラリとは
ある特定の機能を部品化したプログラム。
同じJavaScriptで作られた「JQuery」は、こっち。
②フレームワークとは
ライブラリの機能が「部分的」なものだとすると、もっと広範囲に全体の処理の流れが実装されているプログラム。
穴埋め式のようになっているものもあり、この「穴」を実装すると
全体が動かせるようになる（＝完成する）。
この「穴」を「ホットスポット」と呼ぶ。
（３）Angularの特徴
①MVC（MVW）
アプリケーションを設計するときの考え方の１つ。
「Model（データ）」
「View（画面）」
「Controller（コントローラー）」または「Whatever（何か）」
の頭文字をとったもの。
このMとVとC（W)の役割が混ざらないように
住み分けてプログラミングしていくべき、
という指針を持っている。
②双方向データバインディング
画面からデータを更新できるし、
データを更新したものを画面に反映できる、
というもの。
特に画面をリロードしなくても、
自動的にデータをその場で更新してくれる。（っぽい）
非同期処理とも組み合わせ可能。
（４）留意事項
・色んなライブラリとの入れ食い状態は
良くないので併用しない方が良い。
(JQuery＋Angularとか）
・Angular1.0とそれ以降（2.0～）は互換性なし
（５）環境構築
①「Node.js」をインストールする。
（https://nodejs.org/en/）
Angularの開発ではNode.js 4以上
（＋そのパッケージ管理システムであるnpm）が必要となるため。
バァ～っとインストールが始まる。
②Visual Studio CodeにAngularのプラグイン
「Angular Essentials」を追加する。
③「Angular CLI」をダウンロードする。
（https://angular.jp/guide/releases）
④Angularをインストールする。
今回は、ローカル環境へインストールする前提で進める。
コマンドラインを起動して、以下のインストール指示を出す。
バァ～っとインストールが始まる。
npm install -g @angular/cli
WARNメッセージがいくつか出ているものの、
これで（一応）インストール成功らしい。
⑤ワークスペースにAngularの設定ファイルを追加する。
cd "プロジェクトのカレントディレクトリ"
npx ng new "プロジェクト名" --directory=./ カレントディレクトリをプロジェクト直下に移動してから
「--directory=./」オプションをつけて実行する。
実行後フォルダを見てみると、ファイルが作成されている。
⑥プロジェクトを実行して正しく取り込まれたか確認する。
ターミナルでプロジェクトのカレントディレクトリに移動した上で
以下コマンドを実行し、
実行後にブラウザでhttp://localhost:4200を開く。
npx ng serve⑦こうなっていれば完成（正常に起動完了）。
（６）ソース編集
①サーバを起動した状態で、「src/app/app.component.html」を
変更する。
②保存する。
③自動で変更が反映される。
【出典】
https://www.sejuku.net/blog/9019#JavaScript