Angular とは？
Angular（アンギュラー） とは
「 Googleによって開発されているJavaScriptフレームワーク 」で、「サーバーと連携」出来て、「 WEBアプリ開発で幅広く使われている」そうである。
いろいろ調べてみると、ちょっと敷居は高い（つまり難しい？）けれど、生産性は高いとか動作環境を選ばないとか、概ね良さそうな記事がちらほらと。
じゃあ、さっそくどっかのサイトをみて、サンプルを打ち込んで、動かしてみながら勉強だぁ！、という前にそもそも、Angularって、どういうふうに動くのか？、なにかブラウザにアドオンを入れとくようなものなのか？（そこから知らないレベルなので）、そのへんをまずはすっきりさせておきたい。
最初のIndex.html
以下が、Angularを利用する際の Index.html 。
上記htmlの <app-root></app-root> のところが、Angular のコードに置き換わるところになるようだが、この指定、いったいどういうことなのだろう？
コンポーネント単位での開発
まずは、どういう作り方をするものなのか構造を調べてみると、Angularプログラミングでは、たとえば下記のような階層で配置して、諸々作成するようだ。
全体をまとめる部分が１つあって、あとは画面（というか機能、というか部品？）ごとに、分けて作っていく感じ。
ネーミングに “component” が入っている通り、その単位を「コンポーネント」と称してやっていくようである。
生成された Index.html
そして、上記のような構成のコードをコンパイルして本番動作可能な状態にすると、Index.htmlは以下のようになる。
Angularフレームワークベースで書いた、TypeScript、html、css 、すべて JavaScript に変換されるということですね。なるほど♪
まとめ
「最初のリクエストからどう動いていくのだろう？」というところが疑問だったのだが、Angularフレームワークベースのコードが JavaScript になって、それが最初にブラウザにロードされて処理が始まる、ということで、なんとなく納得。
「じゃあ、画面がたくさんある（Htmlがたくさんある）ようなシステムでは、生成されたJavaScriptも大きくなるのでは？、ロードに時間がかかるということ？」とか、「部分的にロードする仕組みがあるのか？」とか、まだ引っ掛かりはあるけれど、今後の課題として認識しておくことにして、まずは「仕組みに従って書いていけば、いい感じにJavaScriptを生成してくれるフレームワーク」という理解でいこうと思います。
コメント