Mozilla製。X-TagをサポートしたWebコンポーネント「Brick」
BrickはJavaScript製のオープンソース・ソフトウェア（Mozilla Public License）です。
Webアプリケーションは多様性を求められる割にコンポーネントが非常に少なく感じられます。そんな状況を改善すべく開発されているのX-Tagであり、X-Tagを使ってWebアプリケーション開発ができるのが今回紹介するBrickです。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.33.43.1376965452.png)
基本的な使い方。x-appbarでアプリのタイトルバーを作成できます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.33.52.1376965458.png)
さらに追加情報も付与できます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.33.57.1376965463.png)
スタイルシートを使ってカスタマイズも可能。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.34.08.1376965468.png)
カレンダーを使う場合。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.34.57.1376965472.png)
カレンダーもカスタマイズできます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.35.12.1376965477.png)
カード。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.35.16.1376965482.png)
小さなカードを埋め込んだカードも実現できます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.35.34.1376965488.png)
複数のカードをスライドで切り替える機能もあります。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.35.47.1376965494.png)
フリップ。ひっくり返したりできます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.36.00.1376965499.png)
ボタンです。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.36.04.1376965504.png)
ボタンのカスタマイズも可能。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.36.16.1376965510.png)
フッターを定義したりすれば自動で最下部に貼付きます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.36.45.1376965516.png)
複数のパネルを切り替えるデモ。まるでタブバーです。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.36.51.1376965524.png)
スライド式。凝ったUIが実現できます。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.37.30.1376965531.png)
チェックボックス。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.37.38.1376965539.png)
チェックボックスとラジオボタン。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.37.54.1376965546.png)
ボタングループ。
[](http://images.moongift.jp/2013/08/Screenshot 2013-08-19 11.38.06.1376965551.png)
ツールチップ。飛び出していますが…。
Brickを使うことでX-Tagを使ったモダンなUIのWebアプリケーションが素早く開発できるようになります。特にモバイルフレンドリーを謳っており、スマートフォンやタブレットに最適化されたWebアプリケーションに向いているようです。
MOONGIFTはこう見る
BrickはMozillaが開発しているとあって、Firefox OSが対象に考えられていると思われます。ただし専用という訳ではなくWebKitはもちろんIEについても利用が可能です。多彩なコンポーネントがあればWebアプリケーションの開発が素早くなることでしょう。
デザインについてはスタイルシートを使ってカスタマイズが可能です。アクションはJavaScriptを使って処理ができます。X-Tag/JavaScript/スタイルシート、この3つの組み合わせは興味深いです。