Angular

概要

Angularとは、Webアプリケーション開発を効率化するフレームワークの一つ。前身の「AngularJS」を刷新して新たに開発されたもので、米グーグル(Google)社などが開発し、MITライセンスに基いてオープンソースとして公開されている。

Webアプリケーションのうち、Webブラウザ上で実行するクライアント側(フロントエンド開発するための様々な機能を提供する。「フルスタックフレームワーク」を標榜しており、単体でフロントエンド全体を構築できるよう一通りの機能を揃えている。

アプリケーション全体を、内部的な処理を担当する「モデル」、利用者への表示や操作の受付などユーザーインターフェースUI)を担当する「ビュー」、両者を橋渡しする「ビューモデル」の3層に整理にした「MVVM」(Model-View-ViewModelアーキテクチャを基本としており、フロントエンド側に主要な処理を集約したシングルページアプリケーションSPA)の開発に向いている。

前身のAngularJSはJavaScriptフレームワークだったが、AngularはJavaScriptに静的型付けなどの拡張った「TypeScript」を標準の開発言語としている。TypeScrpitはJavaScript上位互換であるため、拡張仕様は使わずにJavaScriptのみを使用して開発することも選択できる。AndularJSバージョン1.x系)とAngular(バージョン2.x系~)は仕様などに互換性がないため注意が必要である。

ページ上の要素とスクリプト上のデータを対応付け(バインディング)でき、変化に対して自動的に追随させることができる。データの変更を対応するページ上の要素(DOMプロパティ)に反映する一方向(片方向/単方向)バインディングと、これに加えてページ上の要素に対する利用者の操作・入力を対応するデータに反映させる双方向バインディングが利用できる。

ビューを構成するUI要素はTypeScriptクラスとしてコンポーネント(部品)化され、テンプレート中ではHTMLのカスタム要素として記述することができる。コンポーネントには独自の属性スタイル、処理を定義することができ、複数のコンポーネントを組み合わせて一つの機能単位とすることもできる。

SPAは単一のWebページアプリケーションを構成するが、指定されたURL(のパス部分)に応じてどの状態を表示するか指定する「ルーティング」をうことができる。これにより、利用者が特定の表示状態をブラウザブックマーク登録したり、検索エンジンクローラアプリケーション内の様々な画面をそれぞれ別のURLで提示することができるようになる。Angularではルーティングモジュールを用いてURLコンポーネントに対応付けることでこれを実現する。

Angularはアプリケーション開発の全体をカバーするツールを揃えており、開発者が必要な処理を実行するためのコマンドラインツール「Angular CLI」や、実行環境に配備できるようにするためのAOT(Ahead-Of-Time)コンパイラビルドツールコンポーネント単体テストWebブラウザの操作を再現するE2Eテスト(End to End testing)を実行する機能を備えている。

(2021.9.23更新)

他の辞典による解説 (外部サイト)

この記事の著者 : (株)インセプト IT用語辞典 e-Words 編集部
1997年8月より「IT用語辞典 e-Words」を執筆・編集しています。累計公開記事数は1万ページ以上、累計サイト訪問者数は1億人以上です。学術論文や官公庁の資料などへも多数の記事が引用・参照されています。
ホーム画面への追加方法
1.ブラウザの 共有ボタンのアイコン 共有ボタンをタップ
2.メニューの「ホーム画面に追加」をタップ
閉じる