Webフロントエンドの開発で近年、最も人気が高いフレームワークといえば「Angular」だろう。Angularは当初、「AngularJS」と呼ばれ、SPA(Single Page Application)の開発に必要なあらゆる機能を詰め込んだフルスタックなフレームワークとして登場した。

 正式リリースから5年近く経過し、愛好者が多いのが特徴だ。2016年に「Angular2」が登場したが、前版との互換性はなく、2017年3月には「3」を飛ばして、Angular2との互換性を持った「Angular4」が登場。以下では、「4」を前提に話を進める。

一見、ハードルが高い「Angular」

 Angularはフルスタックゆえに、初めて触ると、ハードルが高いと感じる。「JavaScriptファイルをダウンロードして、HTMLにscriptタグで組み込む」といった使い方をしないためだ。またTypeScriptを前提としているため、部分的に見慣れないコードを書くこともある。

 Angularの開発環境の構築にはNode.jsが必要だ。以下のコマンドを実行することで、アプリケーション開発の環境が整う。Windows10の「PowerShell」でも動作する。

> git clone https://github.com/angular/
quickstart.git quickstart
> cd quickstart
> npm install
> npm start

 以上のコードは「quickstart」という名前でプロジェクトを作成したところだが、これだけでローカルにWebサーバーが起動し、さらに、ブラウザーも自動的に立ち上がり、サンプルのWebアプリケーションが表示される。

[画像のクリックで拡大表示]